Example code for jquery to realize dynamic increase and decrease of input box_jquery

Through string splicing, the contents of all input boxes are spliced ​​in the format of "1234235#34634234#123525".
Web page code:

Copy code The code is as follows:

Mobile phone:	mobile_div', '')" value='Add another one' >

< /form>


js code:

Copy code The code is as follows: $(function() {

//Initialization

initFields();
});
function initFields(){
//Initialize mobile phone
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]);
}
}
/**
String concatenation
src_id is the name of the source input, dist_id is the id value of the target input
*/
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);
}
/**
Clone an input and display it in the specified container
*/
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 = /^1d{10}$/;
if (!pattern.exec(obj.value)){//Does not match, proceed Processing
span.text('Mobile phone number is incorrect!').css("color","red");
$(obj).addClass("inputError");
return false;
}else {
span.text('');
$(obj).removeClass("inputError");
}
}


Put js The file imports the html file
1

Copy code The code is as follows:

2

Copy code The code is as follows: