jQuery的：一些複選框不包括

我試圖添加或每次點擊複選框一個div刪除HTML，我已經得到了它的一些工作，但不是所有的複選框。jQuery的：一些複選框不包括

一些複選框最初在頁面上時，它加載，並動態地添加其他。這是有在原來的頁面加載時間正確的複選框做他們應該做什麼，但被動態添加的那些沒有被通過在一個jQuery調用.change（）來選擇。

我已經在應該選擇任何複選框的代碼中放置了一個alert（），它只執行原來的複選框，但我也有checkAll和uncheckAll javascript函數，它們成功地做了他們應該做的事情所有複選框。

下面是檢查元素在HTML中的問題顯示的複選框的區域從Firebug的拍攝的片段：

<div class="orglist" style="background:#dddddd;color:#777777;"> 
Orgs to be included: 
<br> 
<input id="org_10346" class="ckbx" type="checkbox" checked="" value="10346" name="org_10346"> 
XYZ 
<br> 
<div id="additional"> 
<input id="org_3" class="ckbx" type="checkbox" checked="" value="3" name="org_3"> 
GHI 
<br> 
</div> 
<b>Add an additional org:</b> 
<br> 
<select class="org_type " name="org_type"> 
<option selected="yes" value=""> </option> 
<option value="company">company</option> 
<option selected="yes" value="facility">facility</option> 
<option value="supplier">supplier</option> 
</select> 
<br> 
Supplier: 
<select class="supplier_select" name="org_select"> 
<option value="ERR">***SELECT ONE***</option> 
<option value="1">ABC</option> 
<option value="2">DEF</option> 
<option value="3">GHI</option> 
</select> 
<input id="addOrgID" type="button" value="Add" onclick="addOrg()"> 
<br> 
<a href="javascript:checkAll()">Check All</a> 
| 
<a href="javascript:uncheckAll()">Uncheck All</a> 
</div>

和這裏的JavaScript函數應該後事：

jQuery('input:checkbox, .ckbx').change(function(){ 
     //Loop through all checkboxes and append div for each one that's checked to the fieldset 
     $tempName=this.name; 
     alert($tempName); 
     $theID = "#fac"+this.id.substr(4); 
     $orgID = "#org"+this.id.substr(4); 
     if(jQuery('input[name='+$tempName+']').val()){ 
     jQuery($theID).show(); 
     jQuery($orgID).show(); 
     } 
     else{ 
     jQuery($theID).hide(); 
     jQuery($orgID).hide(); 
     } 
     jQuery("select").each(function(){ 
      if('electricity'==this.value){ 
     jQuery(".elec"+this.name.substr(5)).show(); 
       jQuery(".gas"+this.name.substr(5)).hide(); 
      } 
      if('gas'==this.value){ 
       jQuery(".elec"+this.name.substr(5)).hide(); 
       jQuery(".gas"+this.name.substr(5)).show(); 
      } 
      if('both'==this.value){ 
     jQuery(".elec"+this.name.substr(5)).show(); 
     jQuery(".gas"+this.name.substr(5)).show(); 
      } 
     }); 
    }).change(); 
    }); 

function checkAll(){ 
    jQuery(':checkbox').prop('checked', true).change(); 
}; 

function uncheckAll(){ 
    jQuery(':checkbox').prop('checked', false).change(); 
}

感謝您的任何建議！

來源

2014-01-09 NME and friend

要處理，不僅原來的複選框，同時也是動態添加一次，你需要使用事件代表團.on。因此，而不是

jQuery('input:checkbox, .ckbx').change(function(){

你現在需要

jQuery('div.orglist').on('change', 'input:checkbox, .ckbx', function(){

來源

2014-01-09 18:14:35 Andrei

活動委派的參考：http：//api.jquery.com/on/#direct-and-delegated-events – showdev

@showdev，謝謝，爲清晰起見而轉述。 – Andrei

謝謝，安德烈！這做的伎倆！ –

以您目前的代碼，jQuery的是選擇存在於負載和結合他們的「變化」事件的所有複選框。但是，添加新複選框時，此綁定不會再次運行！

一個選項是綁定的功能，每一個新的複選框的change活動爲你動態創建。

來源

2014-01-09 18:19:49

jQuery的：一些複選框不包括

回答

相關問題