0

クリック後にすべてのチェックボックスを選択するhtmlチェックボックスがあります。しかし、残念ながらそれは機能していません。ここで何が問題なのですか？

JavaScript コード:

<script language="JavaScript">
function toggle(source) {
 checkboxes = document.getElementsByName('contact_no');
  for(var i=0, n=checkboxes.length;i<n;i++) {
  checkboxes[i].checked = source.checked;
  }
}</script>

PHP コード:

echo "<table width='100%' cellpadding='0' cellspacing='0'>";
echo "<tr>";
echo "<td class='tdhead' valign='top' width='100'><b>Contact Name</b></td>";    
echo "<td class='tdhead' valign='top' width='100'><b>Contact 
Number</b>";                
echo '<input type="checkbox" onClick="toggle(this)" /> Toggle 
All<br/>';              
echo "</tr>";


while($row = mysqli_fetch_array($result))
{  
  $gid = $row['gid'];
  $contact_name = $row['contact_name'];  
  $contact_no =  $row['contact_no'];
  echo "<tr>";              
  echo "<td class='tdhead2' valign='top'>$contact_name</td>";
  echo "<td class='tdhead2' ><input type='checkbox' value='$gid' name='contact_no[]'' 
  />&nbsp;&nbsp;$contact_no</td>";                  
  echo "</tr>";
}

echo "</table>";
4

4 に答える 4

2

各要素の名前は次のとおりですcontact_no[]が、JS コードでは、getElementsByName 呼び出しにgetElementsByName('contact_no')追加します。[]

于 2013-09-26T03:48:48.183 に答える
1

安全のために、以下のコードのようなイベントオブジェクトを処理する必要があります

<script type="text/javascript">
function toggle(evt) {
 evt = window.event || evt;
 var source = evt.srcElement || evt.currentTarget 

 checkboxes = document.getElementsByName('contact_no');
  for(var i=0, n=checkboxes.length;i<n;i++) {
  checkboxes[i].checked = source.checked;
  }
}
</script>
于 2013-09-26T03:54:35.103 に答える
0

別の解決策として、すべて選択アクションを実行するメインのチェック ボックスに Id 属性を追加し、他のチェック ボックスのクラス属性と同じにすることができます。

例えば

$(document).ready(function(){
  $('.selectall').change(function({
    var id = $(this).attr('id');

    if ($(this)is(":checked")) {
      $("." + id).attr('checked','checked');

    } else {
      $("." + id).attr('checked','');
    }
  }))
})

このコードがお役に立てば幸いです

于 2013-09-26T04:30:19.523 に答える