すべて選択（＆A）2回目に作業していないすべてを選択解除してください

&すべて使用ボタンを選択解除します。すべて選択（＆A）2回目に作業していないすべてを選択解除してください

初めてコードを選択して選択解除すると、次のコードが機能しますが、2回目には、私のボタンが機能しません。

HTML：

<button type="button" id="selectAll" class="main"> Select </button> 
<button type="button" id="unselectAll" class="main"> UnSelect </button>

のjQuery：

$("#selectAll").on("click", function() { 

    $("#example tr").each(function() { 
    $(this).find("input").attr('checked', true); 
    }); 
}); 

$("#unselectAll").on("click", function() { 

    $("#example tr").each(function() { 
    $(this).find("input").removeAttr('checked'); 
    }); 
});

JSFiddle

どのように私はこの問題を解決することができますか？

出典

2017-11-28 Ananda

を好むことを願っています。各（関数（）{ $（この） .find（ "input"） '...なぜなら' $（ "＃example tr input"）。それぞれ（function（）{'と検索をスキップ：p –

@JaromandaXでも' each'は冗長です – charlietfl

本当にあなた正しいです –

使用小道具（）（）、あなたは次のようにそれらを一緒に組み合わせることができます：

$("#selectAll, #unselectAll").on("click", function() { 
 
    var selectAll = this.id === 'selectAll'; 
 
    // no need for `each` ... jQuery will do that internally already 
 
    $("#example tbody :checkbox").prop('checked', selectAll); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<button type="button" id="selectAll" class="main"> Select </button> 
 
<button type="button" id="unselectAll" class="main"> UnSelect </button> 
 

 
<table id="example" class="myclass" /> 
 
<thead> 
 
    <tr> 
 
    <th> 
 
    </th> 
 
    <th>Name</th> 
 
    <th>Company</th> 
 
    <th>Employee Type</th> 
 
    <th>Address</th> 
 
    <th>Country</th> 
 
    </tr> 
 
</thead> 
 
<tbody> 
 

 
    <tr> 
 
    <td> 
 
     <input type="checkbox" /> 
 
    </td> 
 
    <td>varun</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input type="checkbox" /> 
 
    </td> 
 
    <td>Rahuk</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input type="checkbox" /> 
 
    </td> 
 
    <td>johm Doe</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input type="checkbox" /> 
 
    </td> 
 
    <td>Sam</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input type="checkbox" /> 
 
    </td> 
 
    <td>Lara</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input type="checkbox" /> 
 
    </td> 
 
    <td>Jay</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input type="checkbox" /> 
 
    </td> 
 
    <td>Tom</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Franciso</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
</tbody> 
 
</table>

出典

2017-11-28 00:17:55 charlietfl

利用propの代わりに、このlink

サンプルあたりattrとremoveAttr：代わりのattrの

$("#selectAll").on("click", function() { 
 

 
    $("#example tr").each(function() { 
 
    $(this).find("input").prop("checked", true); 
 
    }); 
 
}); 
 

 
$("#unselectAll").on("click", function() { 
 

 
    $("#example tr").each(function() { 
 
    $(this).find("input").prop("checked", false); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<button type="button" id="selectAll" class="main"> Select </button> 
 
<button type="button" id="unselectAll" class="main"> UnSelect </button> 
 

 
<table id="example" class="myclass" /> 
 
<thead> 
 
    <tr> 
 
    <th> 
 
    </th> 
 
    <th>Name</th> 
 
    <th>Company</th> 
 
    <th>Employee Type</th> 
 
    <th>Address</th> 
 
    <th>Country</th> 
 
    </tr> 
 
</thead> 
 
<tbody> 
 

 
    <tr> 
 
    <td> 
 
     <input type="checkbox" /> 
 
    </td> 
 
    <td>varun</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input type="checkbox" /> 
 
    </td> 
 
    <td>Rahuk</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input type="checkbox" /> 
 
    </td> 
 
    <td>johm Doe</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input type="checkbox" /> 
 
    </td> 
 
    <td>Sam</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input type="checkbox" /> 
 
    </td> 
 
    <td>Lara</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input type="checkbox" /> 
 
    </td> 
 
    <td>Jay</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input type="checkbox" /> 
 
    </td> 
 
    <td>Tom</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Franciso</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
</tbody>

出典

2017-11-28 00:15:03

は、uは道 `$（ "＃例のTR"）によって、それ

$("document").ready(function() 
 
{ \t 
 
\t $("#mcb").change(function() 
 
\t { 
 
\t \t $("#example tbody :checkbox").prop("checked", $("#mcb").prop("checked")); 
 
\t \t // choose by element or id 
 
\t \t $("#example tbody #scb").prop("checked", $("#mcb").prop("checked")); 
 
\t }); 
 
\t 
 
\t $("[id='scb']").change(function() 
 
\t { 
 
\t \t if($(this).prop("checked")==false) 
 
\t \t { 
 
\t \t \t $("#mcb").prop("checked",false); 
 
\t \t } 
 

 
\t \t var tf=true; 
 
\t \t $("#example tbody #scb").each(function() 
 
\t \t { 
 
    \t \t if($(this).prop("checked")==false) 
 
\t \t \t {tf=false;} 
 
    \t \t }); 
 
\t \t $("#mcb").prop("checked",tf); 
 
\t }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table id="example"/> 
 
<thead> 
 
    <tr> 
 
    <th><input id="mcb" type="checkbox" /></th> 
 
    <th>Name</th> 
 
    <th>Company</th> 
 
    <th>Employee Type</th> 
 
    <th>Address</th> 
 
    <th>Country</th> 
 
    </tr> 
 
</thead> 
 
<tbody> 
 

 
    <tr> 
 
    <td> 
 
     <input id="scb" type="checkbox" /> 
 
    </td> 
 
    <td>varun</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input id="scb" type="checkbox" /> 
 
    </td> 
 
    <td>Rahuk</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input id="scb" type="checkbox" /> 
 
    </td> 
 
    <td>johm Doe</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input id="scb" type="checkbox" /> 
 
    </td> 
 
    <td>Sam</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input id="scb" type="checkbox" /> 
 
    </td> 
 
    <td>Lara</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input id="scb" type="checkbox" /> 
 
    </td> 
 
    <td>Jay</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Francisco</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
    <tr> 
 
    <td> 
 
     <input id="scb" type="checkbox" /> 
 
    </td> 
 
    <td>Tom</td> 
 
    <td>TCS</td> 
 
    <td>IT</td> 
 
    <td>San Franciso</td> 
 
    <td>US</td> 
 
    </tr> 
 

 
</tbody> 
 
</table>

出典

2017-11-28 01:53:57

はい、しかし別の問題があります。 [ここをクリック]（https://stackoverflow.com/questions/47522658/select-checkbox-select-row-table） – Ananda

試してみてください –

すべて選択（＆A）2回目に作業していないすべてを選択解除してください

答えて

関連する問題