Javascript和PHP - 选中并取消选中所有复选框

时间:2012-04-18 14:58:51

标签: php javascript jquery checkbox

我已经在这里研究了所有的答案(https://stackoverflow.com/a/2191026),但即使@davydepauw和@emeraldjava建议的最清晰的代码也不起作用......下面的代码没有选择/取消选择当前的方框在PHP代码中。

echo "<form action=$fileName method='post'>";
...
<script language='JavaScript'>
  $('#select-all').click(function(event) {   
    if(this.checked) {
      // Iterate each checkbox
      $(':checkbox').each(function() {
        this.checked = true;                        
      });
    }
    else {
      // Iterate each checkbox
      $(':checkbox').each(function() {
        this.checked = false;
      });
    }
  });
</script>";
...
// This should select/deselect all checkboxes below:
echo "<input type='checkbox' name='select-all' id='select-all' />";
...
// The below is in the WHILE loop fetching data from MySQL:
echo "<input type='checkbox' name='IndustryID' value='" . $row['IndustryID'] . "'>";
...
</form>

对于@DavidThomas请求,下面是呈现的代码:

<body>
<script language='JavaScript'>
  $('#select-all').click(function(event) {   
    if(this.checked) {
      // Iterate each checkbox
      $(':checkbox').each(function() {
        this.checked = true;                        
      });
    }
    else {
      // Iterate each checkbox
      $(':checkbox').each(function() {
        this.checked = false;
      });
    }
  });
</script>
...
<form action=XXX.php method='post'>
...
<input type='checkbox' name='select-all' id='select-all' />
...
<input type='checkbox' name='IndustryID' value='3'>
...
<input type='checkbox' name='IndustryID' value='5'>
...
<input type='checkbox' name='IndustryID' value='148'>
...
</form>
</body>

5 个答案:

答案 0 :(得分:6)

您必须将所有内容放在document.ready事件中,否则代码将在元素不存在时运行,并且没有要附加的元素并使用正确的脚本标记

<script type="text/javascript">
    $(function(){

     $('#select-all').click(function(event) {   
        if(this.checked) {
          // Iterate each checkbox
          $(':checkbox').each(function() {
            this.checked = true;                        
          });
        }
        else {
          // Iterate each checkbox
          $(':checkbox').each(function() {
            this.checked = false;
          });
        }
      });
    })
</script>

答案 1 :(得分:2)

这是因为你在jquery代码之后添加了复选框。

将您的javascript代码更改为此

   <script language='JavaScript'>
$(document).ready(function(){
      $('#select-all').click(function(event) {   
        if(this.checked) {
          // Iterate each checkbox
          $(':checkbox').each(function() {
            this.checked = true;                        
          });
        }
        else {
          // Iterate each checkbox
          $(':checkbox').each(function() {
            this.checked = false;
          });
        }
      });
});
    </script>";

或在显示复选框后添加您的javascript

答案 2 :(得分:0)

<script type="text/javascript">
    $(function(){

     $('#select-all').click(function(event) {   
          $(':checkbox').each(function() {
             $(this).attr('checked', !checkbox.attr('checked'));                 
          });
      });

    })
</script>

根本没有测试......刚出现在我脑海中

答案 3 :(得分:0)

var selectAll = false;

    if(selectAll) {
        $('input:checkbox').removeAttr('checked');
        selectAll = false;
    }

    else {
        $('input:checkbox').attr('checked', 'checked');
        selectAll = true;
    }

答案 4 :(得分:-1)

你无法使用它..

$(function(){

// add multiple select / deselect functionality
$("#selectall").click(function () {
      $('.case').attr('checked', this.checked);
});

// if all checkbox are selected, check the selectall checkbox
// and viceversa
$(".case").click(function(){

    if(!$(".case:not(:checked)").length)
    {
        $("#selectall").attr("checked", "checked");
    } else {
        $("#selectall").removeAttr("checked");
    }

});
    });

然后这是我构建我的PHP ..

<input type='checkbox' id='selectall'/>
$select = mysql_query ("SELECT * FROM tblname") OR DIE (mysql_error());
while ($row3=mysql_fetch_array($select_orders2)){
  $idd = $row3['id'];
<input type='checkbox' class='case' name='checkbox[]' value='".$idd."'>
}

在此代码中。 sql检索的所有数据都将以类大小写进行迭代。希望这会有所帮助。