it-swarm.com.ru

Выясните, установлен ли переключатель с помощью JQuery?

Я могу установить переключатель в положение флажка, но я хочу настроить своего рода "слушатель", который активируется при установке определенного переключателя.

Возьмите, например, следующий код:

$("#element").click(function()
{ 
    $('#radio_button').attr("checked", "checked");
});

он добавляет проверенный атрибут, и все хорошо, но как мне добавить оповещение? Например, что появляется, когда переключатель отмечен без помощи функции щелчка?

540
Keith Donegan
$('#element').click(function() {
   if($('#radio_button').is(':checked')) { alert("it's checked"); }
});
995
David Hedlund

Если у вас есть группа переключателей с одинаковым атрибутом имени и после отправки или какого-либо события вы хотите проверить, была ли отмечена одна из этих переключателей, вы можете сделать это просто с помощью следующего кода:

$(document).ready(function(){
  $('#submit_button').click(function() {
    if (!$("input[name='name']:checked").val()) {
       alert('Nothing is checked!');
        return false;
    }
    else {
      alert('One of the radio buttons is checked!');
    }
  });
});

Источник

jQuery API Ref

141
Parag

Поскольку решение Парага выдало мне ошибку, вот мое решение (объединяющее Дэвида Хедлунда и Парага):

if (!$("input[name='name']").is(':checked')) {
   alert('Nothing is checked!');
}
else {
   alert('One of the radio buttons is checked!');
}

Это работало нормально для меня!

38
Patrick DaVader

Вы должны были бы связать событие click флажка, поскольку событие изменения не работает в IE.

$('#radio_button').click(function(){
    // if ($(this).is(':checked')) alert('is checked'); 
    alert('check-checky-check was changed');
});

Теперь, когда вы программно изменяете состояние, вы должны также вызвать это событие:

$('#radio_button').attr("checked", "checked");
$('#radio_button').click();
31
Znarkus

// Проверка через класс

if($("input:radio[class='className']").is(":checked")) {
     //write your code         
}

// Проверка по имени

if($("input:radio[name='Name']").is(":checked")) {
         //write your code         
}

// Проверяем данные

if($("input:radio[data-name='value']").is(":checked")) {
         //write your code         
}
18
Nanhe Kumar

Решение будет простым, поскольку вам просто нужны "слушатели", когда установлен определенный переключатель. Сделай это :-

if($('#yourRadioButtonId').is(':checked')){ 
// Do your listener's stuff here. 
}
9
Shah-Kodes

Другой способ - использовать prop (jQuery> = 1.6) :

$("input[type=radio]").click(function () {
    if($(this).prop("checked")) { alert("checked!"); }
});
9
Saeb Amini

Если вы не хотите использовать функцию щелчка, используйте функцию изменения Jquery

$('#radio_button :checked').live('change',function(){
alert('Something is checked.');
});

Это должен быть ответ, который вы ищете. если вы используете версию Jquery выше 1.9.1, попробуйте использовать как устаревшую функцию.

6
iCezz

... Спасибо, ребята ... все, что мне было нужно, это "значение" проверенной радиокнопки, где у каждой радиокнопки в наборе был свой идентификатор ...

 var user_cat = $("input[name='user_cat']:checked").val();

работает для меня...

5
Bill Warren

Работа со всеми типами радиокнопок и браузеров

if($('#radio_button_id')[0].checked) {
   alert("radiobutton checked")
}
else{
   alert("not checked");
}

здесь работает Jsfiddle

4
Thyagu

динамически генерируемая кнопка-радио Проверка значения радио

$("input:radio[name=radiobuttonname:checked").val();

На смене динамического переключателя

$('input[name^="radioname"]').change(function () {if (this.value == 2) { }else{}});
3
Dhaval Kariya

$ ('. radio-button-class-name'). is ('флажок') не работал для меня, но следующий код работал хорошо:

    if(typeof $('.radio-button-class-name:checked').val() !== 'undefined'){
     // radio button is checked
    }
2
Jokerius

попробуй это

    if($('input[name="radiobutton"]:checked').length == 0) {
        alert("Radio buttons are not checked");
    }
2
Muhammad Aamir Ali

Попробуй это:

alert($('#radiobutton')[0].checked)
1
Nandha kumar

jQuery по-прежнему популярен, но если вы не хотите иметь никаких зависимостей, см. ниже. Короткая и понятная функция, чтобы узнать, установлен ли переключатель на ES-2015:

function getValueFromRadioButton( name ){
  return [...document.getElementsByName(name)]
         .reduce( (rez, btn) => (btn.checked ? btn.value : rez), null)
}

console.log( getValueFromRadioButton('payment') );
<div>  
  <input type="radio" name="payment" value="offline">
  <input type="radio" name="payment" value="online">
  <input type="radio" name="payment" value="part" checked>
  <input type="radio" name="payment" value="free">
</div>
0
MaxWall