javascript - Jquery を使用してラベル クリックでラジオ値を取得する

Question

ここに私の問題の例があります：

http://jsfiddle.net/LWcu8/1/

最後にクリックしたラジオボタンではなく、現在クリックしたラジオボタンを取得するにはどうすればよいですか?

Answer 1

$(function(){
  $(".options > label").live("click", function(event)
  {
    radio_value = $(this).prev("input[type='radio']").val();
    $("#clicked").html(radio_value);
  });
});

作業サンプル: http://jsfiddle.net/LWcu8/11/

Answer 2

$(".options > label").live("click", function(event)
{
    radio_value = $(this).prev(":radio").val();
    $("#clicked").html(radio_value);
});

デモ

jQuery > 1.7 を使用する場合は、次のように実行できます。

$(".options").on("click", "label", function(event)
{
    radio_value = $(this).prev(":radio").val();
    $("#clicked").html(radio_value);
});

デモ

ノート

.prev()クリックイベントをその前の要素にバインドするためにlabel必要radioです。

Answer 3

これを試して：

$(".options > label").live("click", function(event)
{
    radio_value = $("#" + $(this).attr('for')).val();
    $("#clicked").html(radio_value);
});​

デモ: http://jsfiddle.net/LWcu8/6/

Answer 4

$(".options > input[name='size']").live("click", function(event)
{
    radio_value = $(this).val();
    $("#clicked").html(radio_value);
});​

コードは、ラジオの値を取得する前に発生するラベルのクリック イベントをバインドします。input[name='size'] をバインドするだけで機能します。

Answer 5

コールバックを遅らせてみてください:

$(".options > label").live("click", function(event) {
    setTimeout(function() {
        radio_value = $("input[name='size']:checked").val();
        $("#clicked").html(radio_value);
    }, 0)();
});​

デモ

Answer 6

コードを次のように変更します。

$("input[name='size']").live("change", function(event)
{
    radio_value = $("input[name='size']:checked").val();
    $("#clicked").html(radio_value);
});​

イベントは、clickラジオ ボタンへの変更が発生する前に、ラベルで発生します。そのため、代わりに変更に対応する必要があります。