ホームページ > ウェブフロントエンド > jsチュートリアル > jquery_jquery でチェックボックスの選択が失敗する場合の解決策

jquery_jquery でチェックボックスの選択が失敗する場合の解決策

WBOY
リリース: 2016-05-16 16:24:11
オリジナル
919 人が閲覧しました

jQuery 1.6 を使用する場合、コード if ($(elem).attr("checked")) は、チェックボックスが選択されているかどうかに関係なく変化しない属性を取得します。これは、デフォルトまたは選択されたプロパティの初期値を保存するためにのみ使用されます。下位互換性を維持するために、jQuery 1.6.1 以降の .attr() メソッドは、属性値を返すだけでなく、プロパティ属性も更新するため、.prop() を介して boolean 属性の値を変更する必要はありません。上記のいずれかの方法を使用して、checked の値を取得することをお勧めします。

jQueryのattrメソッドを使ってチェックボックスの「checked」属性を取得、設定するのですが、htmlソースファイルを見ると、最初は全選択/非選択が有効であることが分かります。 、チェックボックス属性は確かに更新されましたが、ページは更新されません。正しい方法は次のとおりです。

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script><script type="text/javascript">// <![CDATA[
$(function(){
$('.ckAll').click(function(){
$(".box-items").each(function(){
  $(this).prop("checked",!!$(".box-all").prop("checked"));
});
});
});
// ]]></script>
<div><label class="ckAll"><input class="box-all" type="checkbox" /><span>全选</span></label>
<input class="box-items" type="checkbox" />
<input class="box-items" type="checkbox" />
<input class="box-items" type="checkbox" />
<input class="box-items" type="checkbox" />
<input class="box-items" type="checkbox" />
</div>
ログイン後にコピー
関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート