jQueryでdiv領域をクリックしたら中のラジオボタン(またはチェックボックス)にチェックできる、というプラグイン等を探しています。テーブルでtrごとクリックしてチェック、というのは見かけるのですがdivというのは探してもなくて…。どなたかご存じないでしょうか?
trクリックでチェックできるやつあるならdivに変えればいいだけだと思うけどそもそもプラグインいらなくね?
正直な話、この程度のJSくらい20秒で書けるレベルになって当たり前(本職ならば)
// HTMLだけでも対応できる <label class="parent" for="radio_id"> <div>ここに内容を書く</div> </label> <input type="radio" id="radio_id" /> // JSでかくなら $(document).on('click', element, function(event) { var target = $(event.currentTarget); target.find('input[type=radio]').attr('checked', true); });
素朴な疑問ですが、$(this)じゃなくて、$(event.currentTarget)の方がいいんですか?
あくまで自分の好みだけど、クリックイベントでは設定したセレクタを対象とするのか、それともクリックされた要素そのものを対象とするのかがイベントによって変わることが多いから、こうして明示的にすることで後から読んだ時にも分かりやすくしてる。あと「this」はコールバックによって示す対象がコロコロかわるから、ソースを差し替えたりするとおかしな挙動になったり、構造が複雑になると何を示しているのか分からなくなったりと混乱のもとになるからなるべく使いたくない。ただし、全て自分の好みですが。
コメントありがとうございます。参考にさせていただきます。
radioやcheckboxを一個一個divで囲むっていう意味にみえるので試してないけどこんな感じ。プラグイン探すより基本を把握したほうがいいとか、チェックはずすのは要らないのか、とか老婆心のほうが沸くけど。
// <div class="hoge"> $('.hoge').on('click', function(){ $(this).find('input[type=radio]').attr('checked', true); });
すみません、できました^^;ありがとうございます。
他にも回答いただいていたのに気づきませんでした。ありがとうございます。JSはまだよくわからないのですが、勉強します。。。divの中にラジオボタンと文章、画像などが入っていまして、そのdivをクリックしてチェックを入れたいという感じです。
がんばって(ΦωΦ)
みんなの回答 5 件
trクリックでチェックできるやつあるならdivに変えればいいだけだと思うけど
そもそもプラグインいらなくね?
正直な話、この程度のJSくらい20秒で書けるレベルになって当たり前(本職ならば)
// HTMLだけでも対応できる
<label class="parent" for="radio_id">
<div>ここに内容を書く</div>
</label>
<input type="radio" id="radio_id" />
// JSでかくなら
$(document).on('click', element, function(event) {
var target = $(event.currentTarget);
target.find('input[type=radio]').attr('checked', true);
});
radioやcheckboxを一個一個divで囲むっていう意味にみえるので試してないけどこんな感じ。プラグイン探すより基本を把握したほうがいいとか、チェックはずすのは要らないのか、とか老婆心のほうが沸くけど。
// <div class="hoge">
$('.hoge').on('click', function(){
$(this).find('input[type=radio]').attr('checked', true);
});
すみません、できました^^;ありがとうございます。
他にも回答いただいていたのに気づきませんでした。ありがとうございます。
JSはまだよくわからないのですが、勉強します。。。
divの中にラジオボタンと文章、画像などが入っていまして、そのdivをクリックしてチェックを入れたいという感じです。
関連するトピックス