Jquery複選框全部選中框更改值問題 - 複選框正在動態生成（Ajax）

Question

我有一個大問題。下面是代碼：

<tr> 
              <td width="50%"> 
               <select id="ptype" name="ptype" class="required" style="width: 320px; float:left;" SIZE=14 onChange="selecttype(); CategoryGrab('<?php echo $_SERVER["SITE_HTMLROOT"];?>/sell/leftsell_catselect.php?idPtype='+this.value);"> 
                <?php 
                 $namesub=$langid."_name"; 
                 $result = mysql_query ("SELECT id, $namesub FROM ptype_new ORDER BY $namesub"); 
                  while($row = mysql_fetch_array($result)){ 
                   echo "<option value=".$row[0].">".$row[1]."</option>"; 
                  }?> 
               </select> 
              </td> 
              <td width="50%"> 
               <div id="categories"> 
                <div class="control-group" style="width: 320px"> 
                <input type="checkbox" class="chkAll" name="chkall"> All <br/> 
                <?php 
                $namecat=$langid."_name"; 
                $result = mysql_query ("SELECT categories.id, categories.$namecat FROM categories LEFT JOIN ptype_new ON (ptype_new.catid LIKE concat('%::', categories.id, '::%')) WHERE ptype_new.id =12") or die(mysql_error()); 
                 while($row1 = mysql_fetch_array($result)){ 
                  echo '<input type="checkbox" name="'.$row1[1].'" value="'.$row1[0].'">'.$row1[1].'<br/>'; 
                 } ?> 
                </div> 
               </div> 
              </td> 
             </tr> 

這裏是JS代碼：

<script type="text/javascript"> 
$(document).ready(function() { 
    $('.chkAll').click(function() { 
     $(this).parents('.control-group').children(':checkbox').not('.chkAll').attr('checked', this.checked); 
    }); 

    $('.chkAll').parents('.control-group').children(':checkbox').not('.chkAll,:checked').click(function() { 
     $(this).parents('.control-group').children('.chkAll').attr('checked', false); 
    }); 
}); 

複選框的值是從SQL查詢。複選框「CHECK ALL」僅在第一個視圖中工作。 問題是值的變化取決於$ _POST $ id和....以及「CHECK ALL」不再有效。

我該如何解決這個問題？

謝謝

Answer 1

也許你的代碼可以這樣寫：

$(document).ready(function() { 
    $('#categories').on('change','.chkAll',function() { 
     $('.chkAll ~ input[type="checkbox"]',this.parentNode).prop('checked', $(this).prop('checked')); 
    }); 
    $('#categories').on('change','.chkAll ~ input[type="checkbox"]',function(){ 
     $(this).siblings('.chkAll').prop('checked',false); 
    }); 
});