单选按钮始终返回"yes"值

Question

使用简单的单选按钮，如果我选择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条件永远不会触发。我哪里出错了？

Answer 1

input:radio[name="selectlinktype"]将选择您的两个输入。然后.val()检查第一个value，它恰好是"yes"(由于value="yes"(。

您需要通过是否选择输入来子选择输入：input:radio[name="selectlinktype"]:checked

或者，您可以看到事件的目标是什么(因为通常更改事件将源自刚刚激活的元素(，因此不需要选择器：使用this或event.target。

Answer 2

您选择的第一个元素名称为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

Answer 3

您正在检查名称为选择链接类型的收音机的值，但您需要检查单击并选择的单选按钮

另外，使用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

Answer 4

当前选择器与两个单选按钮匹配。使用: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

Answer 5

您可以使用点击事件对其进行管理

<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>

Answer 6

$('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