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數量

回答

相關問題