Как определить состояние радиоблока, запущенного другим элементом в Jquery?

Question

Так что дело в том, что я обновляю элементы radiobox, нажимая на элементы div. Так, например, у меня есть 3 блока, и внутри каждого блока есть 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, который вызывает 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();
    }
});

Вы должны определить обработчик change вне обработчика click:

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

Answer 2

Используйте метки вместо DIV:

<label> <input type="radio" value="1"> Male </label> 

. В приведенном выше примере нажатие на слово "Male" вызовет событие изменения.

---

Я рекомендую использовать метки, но если вы настаиваете на использовании DIVs, этот код будет работать для вас.Событие изменения срабатывает только в том случае, если переключатель не был предварительно отмечен.

$('#payment_method_cards, ...').click(function(){
    var radio = $(this).children('input[name="payment_method"]');

    if ( !radio[0].checked ) {
        radio.attr('checked', true).change();
    }
});