jquery - 如何确定 Jquery 中另一个元素触发的单选框的状态？

Question

所以问题是我通过单击 div 元素来更新单选框元素。例如，我有 3 个 div，每个 div 内有 1 个单选框。

当您单击 div 时，单选框会被选中，但问题是这种方式 .change() 事件不起作用。

当我知道特定的单选框丢失时如何获得结果:检查状态？

这是我目前拥有的代码:

$('#payment_method_cards, #payment_method_ibank_swe, #payment_method_bp').click(function(){
    $(this).children('input[name="payment_method"]').attr('checked','checked');
    $('input[name="payment_method"]').change(function(){
        if($(this).val() == 'bp'){
            alert("Thats the one");
        }
    }
});

单选框更改仅在我单击单选框内部时​​触发，但在 div 上则不会触发。

Answer 1

我假设您有一个与 div 绑定(bind)的事件处理程序，该事件处理程序会触发 click 或添加 checked 属性。为什么在更改单选按钮的状态后不手动触发 change() 函数？

$("#check-me").bind("click", function() {
    $("#radio-btn1").click().change(); 
    // change radio button state, then trigger 'change' event.
});

更新:使用您提供的代码，您将执行类似的操作(由于OP的评论而再次更新):

$('#payment_method_cards, #payment_method_ibank_swe, #payment_method_bp').click(function(){
    var $radio = $(this).children('input[name="payment_method"]'); 
    if (!$radio.is(":checked")) {
        $radio.attr('checked','checked').change();
    }
});

您应该在click 处理程序外部定义change 处理程序:

$('input[name="payment_method"]').change(function(){
    if($(this).val() == 'bp'){
        alert("Thats the one");
    }
}