Question

我有一个页面，我无法直接影响HTML，但我可以添加js / jQuery。在某些情况下，此页面将加载标记为已选中的组中的2个单选按钮。以下是2个按钮：

<input type="radio" name="payment" value="cc" CHECKED>
<input type="radio" name="payment" value="paypal_ipn" CHECKED>

它们没有ID和相同的名称（因为它们是无线电组的一部分）。

如何使用Jquery / JS检查它们？如果两者都被选中，取消选中第二个？

澄清：这段代码是由一些（显然）有缺陷的PHP写的。直到我找到并修复它，我需要通过JS / jQuery快速解决。

Answer 1

我可能在这里有点愚蠢，但是无线电组只允许一个选择？

修改

无线电组只允许在任何给定时间选择一个选项，不需要JS / jQuery。

Answer 2

两者都无法检查，即使它们都已经过＆＃34;检查＆＃34;属性：现场演示

＆＃13;

<input type="radio" name="payment" value="cc" CHECKED>
<input type="radio" name="payment" value="paypal_ipn" CHECKED>

＆＃13;

尽管如此，如果您想强制第二个取消选中，请使用：

$("input[type=radio]:nth-child(2)").prop("checked","false")

或：

$("input[type=radio]:nth-child(1)").trigger("click")

Answer 3

尝试按input

选择第二个value

$("input[value=paypal_ipn]").prop("checked", false);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<input type="radio" name="payment" value="cc" CHECKED>
<input type="radio" name="payment" value="paypal_ipn" CHECKED>

Answer 4

如果您确实需要按代码设置值，请执行以下操作：

$("input[type='radio']").click(function(){
    $("input[type='radio'][name='"+$(this).attr("name")+"']").not(this).attr("checked", false);
});

但正如许多人所说，这不应该是必要的

如果加载了单选按钮，请执行此操作以“取消选择”除第一个单选按钮外的所有按钮：

$("input[type='radio']").not(":first-child").attr("checked", false);

Answer 5

在这个例子中：

    <input type="radio" name="payment" value="cc" CHECKED>
    <input type="radio" name="payment" value="paypal_ipn" CHECKED>

您实际上不需要任何js或查询，因为这些单选按钮具有相同的名称。使单选按钮具有相同的名称可以对它们进行分组，并且只允许选择一个。

考虑这个例子：

    <input type="radio" name="payment" value="cc" CHECKED>
    <input type="radio" name="payment" value="paypal_ipn" CHECKED>
    <input type="radio" name="something_else" CHECKED>

无法同时检查两个第一个单选按钮，因为它们具有相同的名称。第三个是独立的，因为它有一个不同的名称 - 它可以与你选择的另外两个按钮之一一起检查。

Answer 6

您向我们展示的是基于HTML格式的HTML（您应该从不有两个单选按钮，在同一个广播组中同时进行检查），但有一种方法可以让您工作用它。。

虽然我通常不建议将功能绑定到单选按钮的click事件，但您可以使用此功能覆盖单选按钮的正常功能并获取所需的行为。< / p>

$("[name='payment']").on("click", function() {
    $("[name='payment']").prop("checked", false);
    $(this).prop("checked", true);
});

有了它，无论你检查哪个单选按钮，它都会＆＃34;取消检查＆＃34;两者然后检查你点击的那个。

关于这整个答案的奇怪之处在于，我甚至没有一个浏览器会同时显示两个单选按钮，以便正确测试场景。 LOL

Answer 7

如果您有该表格，例如：

<form name="methods" id="methods">
    <input type="radio" name="payment" value="cc" CHECKED>
    <input type="radio" name="payment" value="paypal_ipn" CHECKED>
</form>

获取整个表单的ID，将其分配给变量（var），然后从中提取单选按钮。

var methods = document.getElementById('formId').nameOfRadioButton;
methods; //returns all the radio buttons elements

//look for current state of each elment, 
//then loop through the array 'methods'

for (var i=0; i<methods.lenght; i++){
if(methods[i].checked == true){
    //do nothing since you want to uncheck second one
}
else{
if (methods[i+1]).checked == true) {
methods[i+1]).checked == False; //that unchecks the second element
}
}

Answer 8

试试这个：

var len = $('input[value="cc" ]:checked, input[value="paypal_ipn"]:checked').length;

if (len === 2) {
    $('input[value="paypal_ipn"]').data('checked', false);
} else if (len === 0) {
    $('input[value="paypal_ipn"]').data('checked', true);
}

Answer 9

试试这个：

var len = $('input[value="cc" ]:checked, input[value="paypal_ipn"]:checked').length;

if (len === 2) {
    $('input[value="paypal_ipn"]').data('checked', false);
} else if (len === 0) {
    $('input[value="cc"]').data('checked', true);
}

Answer 10

请检查输入是否具有相同的名称值，选中一个时将取消选中另一个。

lib/

来源：https://www.w3schools.com/html/tryit.asp?filename=tryhtml_radio

如果选中另一个按钮，则使用jQuery取消选中单选按钮

10 个答案: