Javascript,jQuery

【JS】選択済みのチェックボックスの個数をカウントするスクリプトをjQueryで組んでみた

2016/12/09

選択済みのチェックボックスの個数を表示させて欲しいとのリクエストがあったので、さくっと作成してみました。いつの日かまた使うことがあると思うので、備忘録をかねてご紹介。

選択済みcheckboxのカウント

イメージ

checkbox_count_script_demoimage

デモ

コード

まずはhtmlから。単にチェックボックスを並べているだけです。
Pタグでチェックボックスを囲い、カウントする範囲を決めることが出来るようにしています。

<div class="tohokuret"></div> に、結果を表示します。

では、メインのスクリプト。jQuery必須です。

わずか数行のスクリプトですが、これで問題なく動作します。
以下、軽い説明。

チェックボックスが選択/非選択した時のスクリプトとします。

tohoku IDの、チェック済のチェックボックスのカウントを行います。

結果を出力。

ページ表示時に1回、走らせ、個数を取得する作法。
これがないと、選択時/非選択時に初めて、スクリプトが動作します。

参考にしたサイト様

jQueryクックブック

jQueryクックブック

jQuery Community Experts

価格 : 3,888円

-Javascript,jQuery
-, , , , ,