如何在点击特定单选按钮时取消选中单选按钮

16 浏览
0 Comments

如何在点击特定单选按钮时取消选中单选按钮

该问题已经在此处有解答：

使用jQuery设置复选框的“选中”状态

问题在于这个解决方法只在Firefox中起作用。

$(':radio').on("change", function(event) {
  $(this).prop('checked', true);
});
$(':radio').on("click", function(event) {
  $(this).prop('checked', false);
});

在Chrome中，它不允许你选择任何东西。

http://jsfiddle.net/wuAWn/

当然，我可以使用变量并写出类似以下内容的代码：

var val = -1;
$(':radio').on("click", function() {
  if($(this).val() == val) {
    $(this).prop('checked', false);
    val = -1;
  }
  else val = $(this).val();
});

但是我在页面上有几组单选按钮，并且HTML内容是通过AJAX加载的，因此我想为所有单选按钮组编写一个函数，而不是为每个单选按钮组定义变量并为每个单选按钮组编写相同的函数。

编辑：感谢你们对复选框的帮助，但是要想将复选框作为单选按钮组来使用，你需要编写额外的JavaScript代码，在单击时将取消所有其他具有相同名称的复选框的选中状态，我已经有了单选按钮CSS，而且更容易的方法是添加类似look-like-checkbox的类使它看起来像复选框，我使用uniform库进行自定义外观，不管怎样，这是我奇怪的解决方案http://jsfiddle.net/wuAWn/9/

admin 更改状态以发布 2023年5月22日
0

2 答案

0 Comments

单选按钮意味着是必填选项...如果您想要它们未选中时，使用复选框，没有必要使事情变得复杂并允许用户取消单选按钮选择；删除JQuery可以让您从其中选择一个

0
0 Comments

这个简单的脚本允许您取消选中已选中的单选按钮。在所有启用JavaScript的浏览器上都可以使用。

var allRadios = document.getElementsByName('re');
var booRadio;
var x = 0;
for(x = 0; x < allRadios.length; x++){
  allRadios[x].onclick = function() {
    if(booRadio == this){
      this.checked = false;
      booRadio = null;
    } else {
      booRadio = this;
    }
  };
}

0