首页 文章

再次单击时，单选按钮会清除检查

提问于
浏览 次
0

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

但是当我选择任何一个单选按钮时，我不能取消选择相同的，虽然互斥正在进行中，但我希望它们也可以取消选择 .

enter image description here

我的代码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>
javascript radio-button

5 回答

  • 0

    你需要使用javascript ...

    在jquery中进行绑定，它更容易，并且name =应该与您渲染的groupname“name =”属性匹配...

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

    使用此选项取消选择：

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

    你既有代码问题也有误解 .

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

    代码问题是在互斥单选按钮组中，您需要首先选择其中一个 .

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

    • 保持单选按钮地板 . 在集合中添加“无”按钮，使其工作就好像没有选择其他三个按钮一样 . 并且最初选择此“无”按钮 .

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

    回复于
  • 2

    您可以使用属性 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; 
 }
}
    回复于
  • 1

    这是使用属性 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);
    });
}
    回复于

相关问题