Радиокнопка всегда возвращает значение "да"

Используя простую радиокнопку, если я выбираю опцию yes или no, она всегда вызывает опцию yes.

Ниже мой код:

$('input:radio[name="selectlinktype"]').change(function() {
  if ($('input:radio[name="selectlinktype"]').val() == 'Yes') {
    alert("yes");
    var dropdownval = $("#dropDownsub").val();
    target_element.removeAttr('href').attr('action', dropdownval);
  }

  if ($('input:radio[name="selectlinktype"]').val() == 'No') {
    alert("no");
    var dropdownval = $("#dropDownsub").val();
    // target_element.removeAttr('href');
    target_element.removeAttr('action').attr('href', $("#edit-link-url .url").val());
    $(event.target).attr("href", $("#edit-link-url .url").val());
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" id="int-link" name="selectlinktype" value="Yes" /> Yes
<input type="radio" id="href-link" name="selectlinktype" value="No" /> No

Выберите «Да» или «Нет», он всегда будет находиться в состоянии yes, условие no никогда не запускается. Где я ошибаюсь?

1
0
406
6
Перейти к ответу Данный вопрос помечен как решенный

Ответы 6

Вы проверяете значение радио с именем selectlinktype, но вам нужно проверить переключатель, который нажат и выбран

Также используйте блок if и else if вместо двух if. Используйте $(this) для целевого элемента, см. Код ниже

 $('input:radio[name="selectlinktype"]').change(function(){
  var value = $(this).val();
  if(value == 'Yes'){
     alert("yes");
     var dropdownval = $("#dropDownsub").val();
     $(this).removeAttr('href').attr('action', dropdownval);
  } else if(value == 'No'){
   alert("no");
    var dropdownval = $("#dropDownsub").val();
   // target_element.removeAttr('href');
    $(this).removeAttr('action').attr('href',$("#edit-link-url .url").val() );
    $(this).attr("href" , $("#edit-link-url .url").val()); 
 }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" id="int-link"  name="selectlinktype" value="Yes" /> Yes
<input type="radio" id="href-link"  name="selectlinktype" value="No" /> No

Когда я выбираю радиокнопку, event.target выбирает элемент, который я щелкнул, но второй раз, если я нажимаю на какой-то другой элемент, он выбирает last one + this one, аналогично 3-й раз все 3 ... почему это происходит, вы можете помочь?

user2828442 28.09.2018 04:17

В этом случае используйте событие click, а не change, потому что, когда вы выбираете другую радиокнопку, срабатывает предыдущее событие изменения радиокнопки при изменении значения. Используйте $('input:radio[name="selectlinktype"]').click(function(){

Bhushan Kawadkar 28.09.2018 06:04

проблема все та же

user2828442 28.09.2018 12:39

Не могли бы вы воспроизвести эту проблему во фрагменте кода или jsfiddle и передать мне ссылку, чтобы я мог взглянуть на нее.

Bhushan Kawadkar 01.10.2018 06:57
Ответ принят как подходящий

Вы выбираете первый элемент с именем selectlinktype, поэтому это всегда yes. Добавьте :checked в свой селектор, чтобы выделить фактически выбранный элемент.

$('input:radio[name="selectlinktype"]').change(function(){
  if($('input:radio[name="selectlinktype"]:checked').val() == 'Yes'){
     alert("yes");
     var dropdownval = $("#dropDownsub").val();
     target_element.removeAttr('href').attr('action', dropdownval);
  }
  
  if($('input:radio[name="selectlinktype"]:checked').val() == 'No'){
   alert("no");
    var dropdownval = $("#dropDownsub").val();
   // target_element.removeAttr('href');
    target_element.removeAttr('action').attr('href',$("#edit-link-url .url").val() );
    $(event.target).attr("href" , $("#edit-link-url .url").val()); 
 }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" id="int-link"  name="selectlinktype" value="Yes" /> Yes
  <input type="radio" id="href-link"  name="selectlinktype" value="No" /> No

Когда я выбираю радиокнопку, event.target выбирает элемент, который я щелкнул, но второй раз, если я нажимаю на какой-то другой элемент, он выбирает last one + this one, аналогично 3-й раз все 3 ... почему это происходит, вы можете помочь?

user2828442 28.09.2018 04:17

input:radio[name="selectlinktype"] выберет оба ваших входа. Затем .val() проверяет наличие value первого, которым оказался "yes" (из-за value="yes").

Вам необходимо выделить вход в зависимости от того, выбран он или нет: input:radio[name="selectlinktype"]:checked

В качестве альтернативы вы можете увидеть, какова была цель события (поскольку обычно событие изменения происходит от элемента, который был только что активирован), поэтому селектор не нужен: используйте this или event.target.

Когда я выбираю радиокнопку, event.target выбирает элемент, который я щелкнул, но второй раз, если я нажимаю на какой-то другой элемент, он выбирает last one + this one, аналогично 3-й раз все 3 ... почему это происходит, вы можете помочь?

user2828442 28.09.2018 04:17
event.target может быть только одним элементом. Поскольку это не похоже на разъяснение текущего вопроса или ответов, вам следует задать новый вопрос, который правильно отражает ваш текущий код.
Amadan 28.09.2018 05:09

Ваш текущий селектор соответствует обоим переключателям. Либо используйте :checked как часть селектора, либо this для нацеливания на текущее радио:

$('input:radio[name="selectlinktype"]').change(function(e){
  console.clear();
  console.log(e.target);
  if($(this).val() == 'Yes'){
     alert("yes");
     //var dropdownval = $("#dropDownsub").val();
     //target_element.removeAttr('href').attr('action', dropdownval);
  }  
  else if($(this).val() == 'No'){
   alert("no");
    //var dropdownval = $("#dropDownsub").val();
    //target_element.removeAttr('href');
    //target_element.removeAttr('action').attr('href',$("#edit-link-url .url").val() );
    //$(event.target).attr("href" , $("#edit-link-url .url").val()); 
 }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" id="int-link"  name="selectlinktype" value="Yes" /> Yes
<input type="radio" id="href-link"  name="selectlinktype" value="No" /> No

Когда я выбираю радиокнопку, event.target выбирает элемент, который я щелкнул, но второй раз, если я нажимаю на какой-то другой элемент, он выбирает last one + this one, аналогично 3-й раз все 3 ... почему это происходит, вы можете помочь?

user2828442 28.09.2018 04:17

@ user2828442, я не знаю, в каком контексте вы это получаете. Но ни в коем случае не следует выбирать предыдущий. Я указал цель на консоли в моем обновленном ответе ..... пожалуйста, проверьте.

Mamun 28.09.2018 13:08

Вы можете управлять им с помощью события щелчка

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" id="int-link"  name="radio_name" value="Yes" /> Yes
<input type="radio" id="href-link"  name="radio_name" value="No" /> No

<script>
$('input:radio[name="radio_name"]').click(function(){
  var radio_val = $(this).val()
  if(radio_val == 'Yes'){
     alert("yes");
  }  
  else if(radio_val == 'No'){
   alert("no");
 }
});
</script>

 $('input:radio[name="selectlinktype"]').change(function(){
  var value = $(this).val();
  if(value == 'Yes'){
     alert("yes");
     var dropdownval = $("#dropDownsub").val();
     $(this).removeAttr('href').attr('action', dropdownval);
  } else if(value == 'No'){
   alert("no");
    var dropdownval = $("#dropDownsub").val();
   // target_element.removeAttr('href');
    $(this).removeAttr('action').attr('href',$("#edit-link-url .url").val() );
    $(this).attr("href" , $("#edit-link-url .url").val()); 
 }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" id="int-link"  name="selectlinktype" value="Yes" /> Yes
<input type="radio" id="href-link"  name="selectlinktype" value="No" /> No

Другие вопросы по теме