更新时间:2023-09-28 23:41:04
我为您的解决方案使用了不同的方法.
I have used the different approach for your solution.
我为您创建了小提琴,也许它可以为您提供帮助.
I have created the Fiddle for you may be it can help you.
在此处实时查看:
jsfiddle
See it live here:
jsfiddle
下面是代码:
HTML:
<div class="input_fields_wrap">
<button class="add_field_button">Add More Fields</button>
<div>
<input type="text" name="mytext[]" placeholder="Account Title">
<input type="text" name="mytext2[]" placeholder="Description">
<input type="text" name="mytext3[]" placeholder="Credit">
<input type="text" name="mytext4[]" placeholder="Debit">
</div>
</div>
脚本:
<script type="text/javascript">
$(document).ready(function() {
var max_fields = 10; //maximum input boxes allowed
var wrapper = $(".input_fields_wrap"); //Fields wrapper
var add_button = $(".add_field_button"); //Add button ID
var x = 1; //initlal text box count
$(add_button).click(function(e){ //on add input button click
e.preventDefault();
if(x < max_fields){ //max input box allowed
x++; //text box increment
$(wrapper).append('<div><input type="text" name="mytext[]" placeholder="Account Title"><input type="text" name="mytext2[]" placeholder="Description"><input type="text" name="mytext3[]" placeholder="Credit"><input type="text" name="mytext4[]" placeholder="Debit"><a href="#" class="remove_field">Remove</a></div>'); //add input box
}
});
$(wrapper).on("click",".remove_field", function(e){ //user click on remove text
e.preventDefault(); $(this).parent('div').remove(); x--;
})
});
</script>
您只需要更改输入字段的名称.希望对您有所帮助.
You just have to change the name of the input field. I hope it helps.