jQuery：根据用户输入重复X的div数量

我正在构建一个动态的就业申请表。我想要一个询问先前雇主人数的字段，当他们输入一个数字时，说3将复制一个带有这些字段的div 3次，随后用数字在末尾ex：field1，field2更新每个名称和值字段，字段3。jQuery：根据用户输入重复X的div数量

领域，我需要：雇主姓名，职务，主管，地址，省，邮编，电话

这是否有意义？我该怎么做呢？我没有代码期望一个html输入字段。

来源

2011-04-01 Snow_Mac

您是否有一些我们可以使用的现有代码？当然，这是有道理的。 – 2011-04-01 17:48:15

没有。空白状态。 – 2011-04-01 17:50:33

我不确定如何或从哪里开始。 – 2011-04-01 17:51:43

我会做一个for循环和jQuery的append（）函数。

$("#employee_fields_generate").click(function() 
{ 
    $("#employee_fields").html(""); 
    var number_employees = $("input[name='number_employees']").val(); 

    for (i=0; i<=number_employees; i++) 
    { 
     $("#employee_fields").append('<div id="employee'+i+'"> //your field inputs go here </div>'); 
    } 
}); 


<form id="employees_form"> 
    <label for="number_employees">Number of Employees:</label><input type="text" name="number_employees" /> 
    <button id="employee_fields_generate">Generate Fields!</button> 
    <div id="employee_fields"> 
    </div> 
</form>

来源

2011-04-01 17:58:45 Dormouse

代码可以使用一点优化，但这是一般的想法，是的。 – 2011-04-01 18:02:13

有没有办法在运行中执行它。 IE不带一个按钮，他们点击字段，输入一个数字点击其他的东西，然后bam出现一堆新的字段？ – 2011-04-01 20:12:04

是的，更改点击（功能（）为一个键入变体。你必须添加输入验证，但同样的原则适用。 – Dormouse 2011-04-01 22:35:38

如果您希望允许他们在不丢失第一个条目的情况下调整数字，则可以使用类似的方法。

$('input[name=prior_employers]').keyup(function(){ 
    var how_many = parseInt($(this).val()); 
    if(how_many < 1 || isNaN(how_many)) { $('.employer-group').remove(); return; } 
    $('.employer-group:gt('+how_many+')').remove(); 
    var employers = $('.employer-group'); 
    if (employers.length < how_many) { 
     var container = $('#employer-container'); 
     for(i=employers.length; i<=how_many; i++) { 
      container.append('<div class="employer-group"><input type="text" name="employer['+i+'][name]"/></div>'); 
     } 
    } 
});

来源

2011-04-01 18:09:08 Kelly

jQuery：根据用户输入重复X的div数量

回答

相关问题