Jquery获取当前所选单选按钮的值

Question

我有以下单选按钮：

<label>Referred to Health Facility</label>
    <input required name="Health_Ref" type="radio" class="wellness_center radiostyle Health_Ref" id="Health_Ref" value="Yes">
    <div class="radiolabel">Yes</div>
    <input name="Health_Ref" type="radio" required class="wellness_center radiostyle Health_Ref" id="Health_Ref" value="No" checked="checked">
    <div class="radiolabel">No</div>

以下是我的jquery函数来获取值：

$(document).ready(function () {
        $(".Health_Ref").click(function () {
            var value = $(".Health_Ref").val();
            alert(value);
        });
    });

单击第一个或第二个按钮时返回的值是第一个按钮，是的，实现jquery函数的最佳方法是什么，以便我可以获得单击的单选按钮的值？

Answer 1

您可能想尝试将:checked添加到jquery选择器。 Documentation for :checked

选项1 :checked

$(document).ready(function () {
    $(".Health_Ref").click(function () {
        var value = $(".Health_Ref:checked").val();
        alert(value);
    });
});

选项2 $(this)

我使代码更简单。 this是事件处理程序中元素的值，因此您只需使用$(this)将元素转换为jQuery对象。

$(document).ready(function () {
    $(".Health_Ref").click(function () {
        var value = $(this).val();
        alert(value);
    });
});

密码笔：http://codepen.io/anon/pen/wKgBGN

Answer 2

var value = $（“。Health_Ref：checked”）。val（）;

这仅选择当前选中的单选按钮。

同样适用于复选框。