jquery实现输入框动态增减的实例代码_jquery



通过字符串拼接，将所有的输入框中的内容，用“1234235#34634234#123525”这样的格式拼接。
网页端代码：
代码如下:


js代码：
代码如下:
$(function() {
//初始化
initFields();
});
function initFields(){
//初始化手机
var text = $('#mobile').val();
var ss=text.split("#");
if(ss.length>0){
$('#mobile_t').val(ss[0]);
}
for(var i=1;i addinput('mobile_s_div', 'mobile_div',ss[i]);
}
}
/**
字符串拼接
src_id 是源input的name，dist_id是目标input的id值
*/
function compose(src_name, dist_id){
var str="";
var ss = $('input[name='+src_name+']').each(function(i){
if($(this).val() != "")
str+='#'+$(this).val();
});
str=str.substring(1,str.length);
$('#'+dist_id).val(str);
}
/**
克隆一个input，显示在指定的容器内
*/
function addinput(id, div_id, text){
var mobile_div=$('#'+id).clone();
mobile_div.children('input').val(text);
var delbt=$("")
delbt.bind("click", function(){$(this).parent().remove()});
mobile_div.append(delbt)
$('#'+div_id).append(mobile_div);
return false;
}
function check1(){
compose('mobile_t', 'mobile');
}
//
function checkMobilephone(obj){
if(obj == null){
return false;
}
var span = $(obj).parent().children('span');
var str = obj.value;
if(str==""){
span.text('');
$(obj).removeClass("inputError");
return false;
}
var pattern = /^1\d{10}$/;
if (!pattern.exec(obj.value)){//不匹配,进行处理
span.text('手机号码填写错误!').css("color","red");
$(obj).addClass("inputError");
return false;
}else {
span.text('');
$(obj).removeClass("inputError");
}
}

把js文件引入html文件
1
代码如下:


2
代码如下: