jQuery生成的選擇選項不工作在動態字段

我有兩個靜態選擇字段jQuery腳本附加年從下拉菜單和動態字段類似兩個前兩個，你可以添加點擊'weiter'鏈接。jQuery生成的選擇選項不工作在動態字段

現在年值追加腳本對前兩個靜態的字段非常有效，但它不適用於動態生成的字段，即使我使用與前兩個字符相同的類「von_bis」調用它們。

這是因爲他們不上的文件，我想負荷存在....

這是目前的情況：http://jsfiddle.net/dzorz/PnRnR/

HTML：

<span class="label-f">von:</span> 
<select class="span2 von_bis" id="von" name="von"> 
    <option value="0">von</option> 
</select> 
<span class="label-f">bis:</span> 
<select class="span2 von_bis" id="bis" name="bis"> 
    <option value="0">bis</option> 
</select> 

<div id="yearWrapper"> 
</div> 

<a href="" id="btn_weitere" class="btn_weitere">weitere</a>

腳本： //年

$(function(){ 
    for (i = new Date().getFullYear(); i > 1900; i--) 
    { 
     $('.von_bis').append($('<option/>').val(i).html(i)); 
    } 
}); 
//dinamic 
$(document).ready(function() { 

     var MaxInputs  = 5; //maximum input boxes allowed 
     var InputsWrapper = $("#yearWrapper"); //Input boxes wrapper ID 
     var AddButton  = $("#btn_weitere"); //Add button ID 

     var x = InputsWrapper.length; //initlal text box count 
     var FieldCount=1; //to keep track of text box added 

     $(AddButton).click(function (e) //on add input button click 
      { 
       if(x <= MaxInputs) //max input box allowed 
       { 
        FieldCount++; //text box added increment 
        //add input box 
        $(InputsWrapper).append('\ 
        <div class="form-inline f-i-f-d">\ 
         <div class="form-inline f-i-f-d">\ 
          <select class="span2 von_bis" id="von'+ FieldCount +'"\ 
          name="von'+ FieldCount +'">\ 
          <option value="0">von</option>\ 
          </select>\ 
          <select class="span2 von_bis" id="bis'+ FieldCount +'"\ 
          name="bis'+ FieldCount +'">\ 
          <option value="0">bis</option>\ 
          </select>\ 
         </div>\ 
         <a href="#" class="removeclass">remove</a>\ 
        </div>'); 
        x++; //text box increment 
       } 
       return false; 
       }); 

       $("body").on("click",".removeclass", function(e){ //user click on remove text 
       if(x > 1) { 
         $(this).parent('div').remove(); //remove text box 
         x--; //decrement textbox 
       } 
       return false; 
       }) 

     });

它如何應用於se動態字段？

來源

2013-06-21 dzordz

大部分內容已在[jQuery.on（）]（http://api.jquery.com/on/）的文檔中得到解答。查看「委託」事件。 – graup

另外，由於'AddButton'是一個jQuery set alread，$（AddButton）實際上並不合理。爲了不混合這些東西，我有時會命名這些變量'var $ addButton = $（...）;'...'$ addButton.on（...）;' – graup

這不是問題所在。問題在於添加日期的函數在加載時被調用，但未被再次調用。 –

快速的方法是將當前在$(function...)中調用的代碼移動到$(document).ready()中的函數中。定義函數後，調用它，以便初始選擇菜單將應用日期。然後，在if(x <= MaxInputs)聲明中，在致電x++;之前，請再次調用該函數。您可以在此處看到修復程序：http://jsfiddle.net/PnRnR/1/

問題在於您只在加載時調用該函數一次，而每次添加新複選框時都需要調用該函數。

來源

2013-06-21 18:01:27

是啊，這對我很有用...謝謝 – dzordz

jQuery生成的選擇選項不工作在動態字段

回答

相關問題