ボタンを押すことで、ラジオボタンやチェックボックスのdisabledを設定してみます。
よく使うのですが、よく使う割りに忘れてしまうのでおぼえがきです。
それぞれ「name」属性は同じにしてます。
公式に「prop」と「attr」で取得できる値が異なることが記載されています。
http://api.jquery.com/prop/
中段くらいにある「Attributes vs. Properties」の一覧表です。
ラジオボタンとチェックボックス・・・分けなくてもよかったのですが。
サンプルページはこちら
HTMLのサンプル
ラジオボタン :ラジオボタンが3つとチェックボックスが3つ。
jquery
java
php
チェックボックス:
jquery
java
php
それぞれ「name」属性は同じにしてます。
jqueryのサンプル
$(document).ready(function(){ //ラジオボタン用 disabled設定 or 解除 $(document).on("click", "[name^='radiobutton']", function() { var name = $(this).attr('name'); var flg = name.split('_')[1]; if (flg == 'on') { //disabled $(":input[name^='radio_']").prop('disabled',true); } else { $(":input[name^='radio_']").prop('disabled',false); } }); //チェックボックス用 disabled設定 or 解除 $(document).on("click", "[name^='checkbutton']", function() { var name = $(this).attr('name'); var flg = name.split('_')[1]; if (flg == 'on') { //disabled $(":input[name^='check_']").prop('disabled',true); } else { $(":input[name^='check_']").prop('disabled',false); } }); });ここでは「prop」を使っていますが、「attr」を使っても出来るみたいです。 ちなみに「attr」を使ってみると、
if (flg == 'on') { //disabled $(":input[name^='radio_']").attr('disabled','disabled'); } else { $(":input[name^='radio_']").removeAttr('disabled'); }こんな感じです。
公式に「prop」と「attr」で取得できる値が異なることが記載されています。
http://api.jquery.com/prop/
中段くらいにある「Attributes vs. Properties」の一覧表です。
ラジオボタンとチェックボックス・・・分けなくてもよかったのですが。
サンプルページはこちら
0 コメント:
コメントを投稿