*

jqueryを使用したチェックボックスの一括選択・一括解除

   

またチェックボックスネタで恐縮なんですが、jqueryでの書き方が分かりやすかったのでメモです。

check_all

スポンサードリンク

地域選択とかでよく使いそうなやつです。
チェックボックス一括選択のサンプル

※CSSなどは前回の分を使いまわしてます。

<div id="#wrapper">
	<ul>
		<li>
			<input type="checkbox" name="fukuoka_all" id="fukuoka_all" class="allFukuoka">
			<label for="fukuoka_all">福岡市</label>
		</li>
		<li>
			<input type="checkbox" name="higashiku" id="higashiku" class="checkFukuoka">
			<label for="higashiku">東区</label>
		</li>
		<li>
			<input type="checkbox" name="hakataku" id="hakataku" class="checkFukuoka">
			<label for="hakataku">博多区</label>
		</li>
		<li>
			<input type="checkbox" name="chuouku" id="chuouku" class="checkFukuoka">
			<label for="chuouku">中央区</label>
		</li>
		<li>
			<input type="checkbox" name="minamiku" id="minamiku" class="checkFukuoka">
			<label for="minamiku">南区</label>
		</li>
		<li>
			<input type="checkbox" name="nishiku" id="nishiku" class="checkFukuoka">
			<label for="nishiku">西区</label>
		</li>
		<li>
			<input type="checkbox" name="jonanku" id="jonanku" class="checkFukuoka">
			<label for="jonanku">城南区</label>
		</li>
		<li>
			<input type="checkbox" name="sawaraku" id="sawaraku" class="checkFukuoka">
			<label for="sawaraku">早良区</label>
		</li>
	</ul>
</div>
$(function(){
	$('.allFukuoka').on('change', function() {
		$('input[class=checkFukuoka]').prop('checked', this.checked);
	});
});

jqueryも相変わらず緩くしか理解してないので「attr」と「prop」の違いがよくわかってなかったのですが、こちらで詳しく解説してくれてました↓
jQueryにおけるattrとpropの違いと使いドコロまとめ

「attr」:属性における値 を取得
「prop」:checkedという プロパティの真偽 を取得

inputを使用するときは「prop」と憶えてた方がよいみたい。

 -iPhone, Web

Sponsored link

Sponsored link

  関連記事

no image

結局Refills買ってみた

今主婦中にもかかわらず、とうとうRefills買ってみた。 Refills for iPhone そのうち仕事でも使うで

no image

docomoのXHTMLでCSSをきかせる

また今更なメモです。 ※新しい機種は、これ入れなくても実機での確認はできてる様子? ++++++++++++++++++

no image

Google Analyticsで自分のアクセスを除外する

今更ネタではあるかもしれませんが。 今までなんとなく知ってた方法は、 1)アナリティクスのフィルタで除外する方法。 参考

:beforeや:afterを使用した際、アイコンとテキストの上下を中央に合わせる

毎回やり方を忘れてしまうので自分用のメモです。 ※スマホ用でやってるので、IEなどのブラウザでは確認してません

SBI証券から確定拠出年金のIDとパスワードが届きました

去年の12月中旬に書類を提出して、そのままストップしてた確定拠出年金がようやく始まりそうです。 SBI証券から管理画面の

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


*

共働きの30代女性。
福岡でWebに携わってます。
主に自分用の細かいメモを書いてます。
細かい内容が多いですが、他の方にも役立つなら幸いです。

ブログの記事を紹介していただきました

このブログ更新するの、約1年ぶりか(汗) すごいお久しぶりです。 このブログを始めてもう地味に10年くらい経つのですが(

確定拠出年金、退職したときに行う手続き(継続するor掛金停止する)

私、昨年から確定拠出年金をしております。 会社には確定拠出年金の制度がなかったので、「個人型年金」の加入者として掛金の拠

実は先月で退職しました

だいぶブログさぼっておりましたが、実は先月末で会社を退職しました。 別にこの歳になって、自主退職したわけじゃないのです。

  • ブログランキング・にほんブログ村へ