3

重複の可能性:
チェックボックスすべてのオプションをチェック

<form action='ppc_logistic-control_number.php' target='_blank' method='post'>
<b>Sample Program</b><br>
<input type='checkbox'>
<?php
for($i=0;$i<5;$i++)
{
print"<input name='checkbox[]' type='checkbox' id='checkbox[]' value='$i->logi_id' value='$i->ppc_id' style='margin-left:-5px'><br>";
}                       
?>
<input type="submit" value="submit" name="gen"/>

ここに順番に配置する必要のあるjqueryまたはjavascriptコード:5つのチェックボックスの上にあるチェックボックスをオンにすると、すべてのチェックボックスにチェックが入ります。以前にチェックしたチェックボックスを削除すると、5つのチェックボックスも削除されます。 。


サンプル: ここに画像の説明を入力してください


サンプルデモありがとうございます。

4

4 に答える 4

4

デモをチェック

これが基本的なロジックになります。

HTML ページのIDは一意である必要があります。代わりにクラスを使用してみてください

于 2012-10-10T07:14:46.337 に答える
1

JavaScript を使用して

<input type="checkbox" value="select" onclick="javascript:checkAll()" name="allbox" class="table_ckbox" /></th>

関数 checkAll()

{

for (var i=0;i<document.delete_form.elements.length;i++)
{
    var e=document.delete_form.elements[i];
    if ((e.name != 'allbox') && (e.type=='checkbox'))
    {
        e.checked=document.delete_form.allbox.checked;
    }
}
return false;
 }

allチェックボックスを使用するphpで

foreach($listArr as $list) {

 echo '<td><input type="checkbox" value="'.$list['id'].'" name="module[]" /></td>';
 }
于 2012-10-10T07:25:04.800 に答える
1

これを試して

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Sample Program</title>
<script src="http://code.jquery.com/jquery-1.7rc2.js"></script>

</head>

<body>
<form action='ppc_logistic-control_number.php' target='_blank' method='post'>
<b>Sample Program</b><br>
<div id="check-b">
<input type='checkbox' id="top-checkbox">
<?php
for($i=0;$i<5;$i++)
{
print"<input name='checkbox[]' type='checkbox' id='checkbox[]' value='$i->logi_id' value='$i->ppc_id' style='margin-left:-5px'><br>";
}                       
?>
<input type="submit" value="submit" name="gen"/>
</div>
</form>
<script type="text/javascript">
$(function(){
    $('#top-checkbox').change(function(){
        var isChecked = $(this).attr("checked");
        if (isChecked) {
        $('#check-b').find(':checkbox').prop('checked', true);   
        }else{
            $('#check-b').find(':checkbox').prop('checked', false);   
        }
    });

});
</script>

</body>
</html>
于 2012-10-10T07:48:39.403 に答える
0

以下は、クラスに基づいてチェックボックスをオンまたはオフにするサンプルを示しています。

parent最初の要素のクラスをに、他のすべての要素をにしたいと思うかもしれませんchild。以下のコードは単にあなたの仕事を楽にします

注:このコードをコピーしてhtmlファイルに貼り付け、いろいろ試してみると、よく理解できます。

<html>
<body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript">
 $(document).ready(function(){
   $(".parent").click(function(){
        var check = $(this).attr('checked');
        if(check=="checked")
        {
         $(".child").attr('checked','checked');
        }
        else
         $(".child").removeAttr('checked');
   });
 });
</script>

<input type="checkbox" name="vehicle1" id="vehicle1" class="parent" value="Bike">Parent<br />
<input type="checkbox" name="vehicle2" id="vehicle2" class="child" value="Car">Child 1<br />
<input type="checkbox" name="vehicle3" id="vehicle3" class="child" value="Car">Child 1<br />
<input type="checkbox" name="vehicle4" id="vehicle4" class="child" value="Car">Child 1<br />
<input type="checkbox" name="vehicle5" id="vehicle5" class="child" value="Car">Child 1<br />

</body>
</html>
于 2012-10-10T09:27:44.510 に答える