javascript - 再次单击时单选按钮清除检查

Question

我有一组三个单选按钮，它们相互排斥，因为我实现了组名属性，但问题是，在初始阶段，没有选择单选按钮，

但是，当我选择任何单选按钮时，我无法取消选择相同的选项，尽管正在进行互斥，但我希望它们也取消选择。

我的代码aspx是：

<td>
<asp:RadioButton ID="AChk" runat="server" CssClass="itemRightAlign" GroupName="A"/>
</td>
<td>
<asp:RadioButton ID="DChk" runat="server" CssClass="itemRightAlign" GroupName="A"/>
</td>
<td>
<asp:RadioButton ID="WChk" runat="server" CssClass="itemRightAlign" GroupName="A"/>
</td>

Answer 1

您既有代码问题，也有误解。

误解是关于互斥单选按钮如何工作（或应该工作）（或用户期望工作）。

代码问题是，在互斥单选按钮组中，您最初需要选择其中一个。

所以，我相信有两种方法可以解决这个问题：

1. 保持单选按钮接地。在集合中添加一个“无”按钮，这样就好像其他三个都没有被选中一样。并最初选择此“无”按钮。

2. 将单选按钮更改为复选框，以便用户可以选择和取消选择它们中的每一个。然后实现你自己的排除逻辑。我不推荐这个。

Answer 2

您将需要使用 javascript...

在 jquery 中进行绑定，它更容易，并且 name= 应该与您呈现的 groupname "name=" 属性匹配...

var lastChecked = null;
$('input[name=A]').click(function(){
  if (lastChecked == this) {
    this.checked = false;
    lastChecked = null;
  }
  lastChecked = this;
});

Answer 3

这是使用属性ondblclick和 jQuery 的类似实现。此外，这将允许您将此功能包含在具有动态生成的客户端 ID 的控件中。

后面的代码：

foreach (ListItem li in rbl.Items)
    li.Attributes.Add("ondblclick", string.Format("clearCurrentRadioButtonSelection(\"{0}\")", rbl.UniqueID));

ASPX 页面

function clearCurrentRadioButtonSelection(controlName) {
    var id = "input[name=" + controlName + "]";

    $(id).each(function () {
        $(this).attr('checked', false);
    });
}

Answer 4

您可以使用属性取消选择单选按钮ondblclick。

<input type="radio" name="RadioGroup1
" value="1" ondblclick="uncheckRadio();">
    Apple</label>

当您双击单选按钮时，只需调用 javascript 函数将checked属性设置为 false。

function uncheckRadio() {
 var choice = document.form1.RadioGroup1;
 for (i = 0; i < choice.length; i++) {
  if ( choice[i].checked = true ) 
   choice[i].checked = false; 
 }
}

Answer 5

使用它来取消选择：

var radios = document.getElementsByName('A');
for(var i=0; i<radios.length; i++)
{
    radios[i].checked = false;
}