Jquery でチェックボックスの値から処理を分岐させる方法

先日、フォームのチェックボックス(input type=checkbox)がチェックONと、チェックOFFを判断し、処理を行う事例があり、少しはまったのでとして残します。

チェック=クリックと思って、クリックで処理したら失敗

似たような処理に、クリックしたらイベント処理を行うものがあり、チェックボックスもクリックだろうと思ってやったら、失敗しました。
この場合は、「変更」[change]として処理すればよいようです。

■ソース


$(document).ready(function()
{
$(“#id_chk”).change(function()
{
if ($(“[name=name_chk]”).prop(“checked”) == true)
{$(“#disp”).text(“チェックボックス check on”);}
else
{$(“#disp”).text(“チェックボックス check off”);}
});
});

チェックボックスを選択・非選択のタイミングで、クリックでも動作はするのですが、この場合は「変更」として、changeを使うのが良いようです。

また、propは、inputタグの値の状態を確認・設定するタグで、この場合チェックONの時 true、チェックOFFの時はfalseが発生します。

チェックボックスや、ラジオボタンは、項目が複数になることが前提のため、選択されている値を取得するというものもございますが、それはまた別の機会に。

 

今回のレポートは以上です。
読んでいただいてありがとうございました。


ホームページに関するお悩み事やご相談事がございましたら私どもまでご連絡ください。 鋭意ご対応申し上げます。
ホームページのご提案もさせていただいております