Как переключить состояние проверки элемента радиовхода при нажатии?

Как (un) проверить элемент ввода радиоприемника при щелчке элемента или его контейнера?Как переключить состояние проверки элемента радиовхода при нажатии?

Я пробовал код ниже, но он не отключает радио.

HTML:

<div class="is"> 
    <label><input type="radio" name="check" class="il-radio" /> Is </label> 
    <img src="picture" /> 
</div>

JQuery:

$(".is label, .is ").click(function() { 
    if (!$(this).find(".il-radio").attr("checked")) { 
     $(this).find(".il-radio").attr("checked", "checked"); 
    } else if ($(this).find(".il-radio").attr("checked") == "checked") { 
     $(this).find(".il-radio").removeAttr("checked"); 
    } 
});

источник

2012-03-16 funerr

почему бы вам не просто использовать этикетку в его первоначальном виде? http://www.w3schools.com/tags/tag_label.asp –

@OriesokVlassky: потому что для каждого элемента управления нужно будет иметь идентификатор, чтобы метка ссылалась на него. ' ...' действительный HTML; он должен работать. – cHao

Проверьте http://stackoverflow.com/questions/2117538/jquery-how-to-uncheck-a-radio-button –

Y ou должны предотвращать поведение по умолчанию. В настоящее время, по щелчку, происходит следующее:

click пожаров событий для контейнера (div.is).
click события пожара для этикетки.
Поскольку ваша функция переключает состояние, а прослушиватель событий вызывается дважды, результатом является то, что ничего не происходит.

Исправленный код (http://jsfiddle.net/nHvsf/3/):

$(".is").click(function(event) { 
    var radio_selector = 'input[type="radio"]', 
     $radio; 

    // Ignore the event when the radio input is clicked. 
    if (!$(event.target).is(radio_selector)) { 
     $radio = $(this).find(radio_selector); 
     // Prevent the event to be triggered 
     // on another element, for the same click 
     event.stopImmediatePropagation(); 
     // We manually check the box, so prevent default 
     event.preventDefault(); 
     $radio.prop('checked', !$radio.is(':checked')); 
    } 
}); 
$(".il-radio").on('change click', function(event) { 
    // The change event only fires when the checkbox state changes 
    // The click event always fires 

    // When the radio is already checked, this event will fire only once, 
    // resulting in an unchecked checkbox. 
    // When the radio is not checked already, this event fires twice 
    // so that the state does not change 
    this.checked = !this.checked; 
});

источник

2012-03-18 20:37:46

Можете ли вы это сделать, если я нажму на радио, я тоже его проверю? – funerr

Теперь изображение не вызывает выбор. – funerr

@ agam360 Ранее свойство 'event.target' использовалось в качестве ссылки. Это было неправильно, и теперь это исправлено. –

радиокнопки не снимите, вы должны использовать флажок (тип = 'флажок')

источник

2012-03-16 13:27:51 CKKiller

Можете ли вы дать мне правильный способ сделать это для радио? – funerr

радиокнопка обычно отключена только при нажатии на другую радиокнигу с тем же атрибутом «имя», это базовый HTML – CKKiller

Радиоустройства работают именно так. Вы должны использовать флажок, если вы хотите «check-uncheck» поведение – MatuDuke

использование только HTML, такая же функциональность

<label for="rdio"><input type="radio" name="rdio" id="rdio" class="il-radio" /> Is </label>

источник

2012-03-16 13:30:02 sandeep

Атрибут 'for' не требуется, когда элемент управления является единственным в метке. – cHao

Но я хочу, чтобы он сам выбирал при нажатии ... – funerr

Как переключить состояние проверки элемента радиовхода при нажатии?

ответ

Смежные вопросы