文档章节

jQuery增加和减少表单元素

h
 huiyingzzx1018
发布于 2016/06/28 15:27
字数 307
阅读 19
收藏 0

主要使用append方法

function add(){
        var max = parseInt($("#maxnum").val());
        var maxnext = max + 1;
        var html = '<div  id="optionGroup'+maxnext+'"><div class="form-group"> <label class="col-md-2 control-label"><fmt:message key="activityNews.vote.optionNew"/></label> <div class="input col-md-6"> <input type="text" name="voteOption" value="" class="form-control" maxlength="100" id="text'+maxnext+'"/> <a href="javascript:void(0);" data-original-title="删除" onclick="javascript:minus('+maxnext+',-1);" style="position: absolute;right:15px;top:7px;"><i class="fa fa-minus-square"></i></a> </div>  <a href="javascript:void(0);" class="btn btn-xs btn-default" data-original-title="增加" id="addbutton'+maxnext+'" onclick="javascript:add();" style="height: 20px"> <i class="fa fa-plus-square"></i> </a>  </div> <div class="form-group" style="clear: both;" > <label class="col-md-2 control-label"><fmt:message key="activityNews.picUrl" /></label> <div class="input col-md-6"> <div class="add-file"> <span class="button"><input type="file" name="option_pic" onchange="this.parentNode.nextSibling.value = this.value"> <fmt:message key="common.attachImage" /></span><input type="text" placeholder="请上传 640 * 320 的图片" class="form-control required" readonly="readonly"> </div> </div> </div> </div>';
        //$("#addbutton"+max).css('display','none');
        $('#option2').append(html);
        $("#maxnum").val(maxnext);
        for(var i = max; i > 0; i--){
            if($("#text"+i).val() != undefined){
                $("#addbutton"+i).css('display','none');
                break;
            }
        }
    }
function minus(num,id){
        if(num == 1 || num == 2){
            return false;
        }
        var pre = num - 1;
        var max = parseInt($("#maxnum").val());
        if(id != -1){
            var html = '<input type="hidden" name="voteOptionDeleteId" value="'+id+'"/>';
            $("#optionDelete").append(html);
        }
        $("#optionGroup"+num).remove();
        
            for(var i = max; i > 0; i--){
                if($("#text"+i).val() != undefined){
                    $("#addbutton"+i).css('display','inline');
                    break;
                }
            }
            
    }

 

© 著作权归作者所有

共有 人打赏支持
h
粉丝 2
博文 2
码字总数 564
作品 0
苏州
jQuery基础 - 常用基本属性

jQuery简介 jQuery 是一个 JavaScript 库,极大地简化了 JavaScript 编程 jQuery 对象是通过jQuery包装DOM对象后产生的对象,jQuery对象是jQuery独有的,如果一个对象就是jQuery对象,那么它...

ZHAO_JH
07/31
0
0
JavaWeb05-HTML篇笔记(一)

1.1上次课内容回顾: JQuery: JQuery的概述:是一个轻量级的JavaScript的类库.对JS进行封装. 常见的JS的框架: JQuery的使用: JQuery的选择器:(*) JQuery实现效果: JQuery样式操作: JQuer...

我是小谷粒
05/10
0
0
jQuery ajax - serialize()方法以及常见问题

使用ajax时,常常需要拼装input数据为'name=abc&sex=1'这种形式,用JQuery的serialize方法可以轻松的完成这个工作! jQuery ajax - serialize() 方法定义和用法 serialize() 方法通过序列化表...

freedonn
2014/05/10
0
0
转-JQuery选择器及radio,checkbox,select取值和反选

jQuery 的选择器可谓之强大无比,这里简单地总结一下常用的元素查找方法 $("#myELement") 选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元...

huntering
2015/08/25
0
0
Python自动化开发学习17-jQuery

jQuery学习之前 jQuery 是 JavaScript 的一个类库,类似 python 中的模块。 jQuery在线手册:http://jquery.cuishifeng.cn/ 官网:http://jquery.com/ 版本选择 目前jQuery有三个大版本:1.x...

骑士救兵
06/21
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

maven坐标和依赖

一、maven坐标详解 <groupId>com.fgt.club</groupId><artifactId>club-common-service-facade</artifactId><version>3.0.0</version><packaging>jar</packaging> maven的坐标元素说......

老韭菜
今天
1
0
springmvc-servlet.xml配置表功能解释

问:<?xml version="1.0" encoding="UTF-8" ?> 答: xml version="1.0"表示是此xml文件的版本是1.0 encoding="UTF-8"表示此文件的编码方式是UTF-8 问:<!DOCTYPE beans PUBLIC "-//SPRING//......

隐士族隐逸
今天
1
0
基于TP5的微信的公众号获取登录用户信息

之前讲过微信的公众号自动登录的菜单配置,这次记录一下在TP5项目中获取自动登录的用户信息并存到数据库的操作 基本的流程为:微信设置自动登录的菜单—>访问的URL指定的函数里获取用户信息—...

月夜中徘徊
今天
0
0
youTrack

package jetbrains.teamsys.license.runtime; 计算lis package jetbrains.ring.license.reader; 验证lis 安装后先不要生成lis,要把相关文件进行替换 ring-license-checker-1.0.41.jar char......

max佩恩
今天
1
0
12.17 Nginx负载均衡

Nginx负载均衡 下面的dig看到可以返回2个IP,就是解析出来的IP,这样我们可以做负载均衡。 dig www.qq.com 1.vim /usr/local/nginx/conf/vhost/fuzai.conf 2.添加如下配置 upstream qq //定义...

芬野de博客
今天
0
0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部