- 締切済み
AJAXで生成したHTMLでのチェックボックス一括チェックの方法を教えてください
現在jqueryを使って、ajaxでチェックボックスを生成して、それに対して一括チェックボタンを付けたいと考えております。 <input name="allcheck" type="checkbox" id="checkall" checked="checked" />全て<br /> <input type="checkbox" name="carrier" value="docomo" checked="checked" />docomo<br /> <input type="checkbox" name="carrier" value="au" checked="checked" />au<br /> <input type="checkbox" name="carrier" value="softbank" checked="checked" />softbank<br /> というチェックボックスがajaxで生成されて function carrier_check() { $('#checkall').click(function(e){ $(':checkbox[type=checkbox][name=carrier]').attr('checked', $('#checkall').attr('checked')); }); } のjavascriptで上記のチェックボックスを一括チェックできるようにしようとしているのですが ajaxを使わずに上記のチェックボックスをHTMLに書いているときは一括チェックできるのですが、ajaxを使用して生成した場合にはチェックボックスの一括チェックができません。 どのようにすれば、ajaxで生成されたチェックボックスを一括チェックできるようになるのでしょうか？ ご存知の方がいらっしゃいましたらご教授お願いいたします。
- silverfall
- お礼率100% (2/2)
- JavaScript
- 回答数2
- ありがとう数4
- みんなの回答 （2）
- 専門家の回答
みんなの回答
- yyr446
- ベストアンサー率65% (870/1330)
<ajaxを使わずに上記のチェックボックスをHTMLに書いているときは一括チェックできるのですが、 ajaxを使用して生成した場合にはチェックボックスの一括チェックができません。> と言う事は、きっとcheckboxを生成する前にcarrier_check()を実行している からですよ。carrier_check()の内容はまちがってないみたいだから、 ajax実行後にcarrier_check()を実行すればよい。 前後がわからないので、document readyで"id="hoge"のDIVにチェックボッ クスを生成した時のサンプルですけど、 <body> <div id="hoge"> <div> <script type="text/javascript"> <!-- $(function(){ var val='<input name="allcheck" type="checkbox" id="checkall" checked="checked" />全て<br />'; val +='<input type="checkbox" name="carrier" value="docomo" checked="checked" />docomo<br />'; val +='<input type="checkbox" name="carrier" value="au" checked="checked" />au<br />'; val +='<input type="checkbox" name="carrier" value="softbank" checked="checked" />softbank<br />'; $("#hoge").html(val); carrier_check(); }); function carrier_check() { $('#checkall').click(function(e){ $(':checkbox[type=checkbox][name=carrier]').attr('checked', $('#checkall').attr('checked')); }); } // --> </script> </body>
- babu_baboo
- ベストアンサー率51% (268/525)
//@cc_on document./*@if( @_jscript ) attachEvent( 'on' + @else@*/ addEventListener( /*@end@*/ 'click', function ( evt ) { var e = evt./*@if( @_jscript ) srcElement @else@*/ target /*@end@*/; if( 'checkall' === e.id ) { var o, c = 0, chbxs = document.getElementsByName( 'carrier' ); while( o = chbxs[ c++ ] ) o.checked = e.checked; } }, false );
お礼
動きましたーーーー。ありがとうございます。
お礼
うぉぉぉ、動きました。 ありがとうございます。助かりました！！