javascript - 如何取消选中选中的单选按钮

标签 javascript jquery radio-button

<分区>

问题是这个解决方案只适用于 firefox

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

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

在 chrome 中,它不允许你选择任何东西 http://jsfiddle.net/wuAWn/

Ofc,我可以使用变量并编写类似的东西

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

但是我的页面上会有几个单选按钮组,并且 html 内容是通过 ajax 加载的,所以我想为所有单选按钮组编写 1 个函数,而不是为每个单选按钮组定义变量并为每个单选按钮组。

编辑:感谢您在复选框方面的帮助,但是要将复选框用作单选按钮组,您需要编写额外的 javascrip 来取消选中所有其他具有相同名称的复选框,我已经有了单选按钮 css 并且它更容易我只是添加类似复选框的类并使其看起来像复选框,我使用统一库来自定义外观,无论如何这是我奇怪的解决方案 http://jsfiddle.net/wuAWn/9/

最佳答案

这个简单的脚本允许您取消选中已选中的单选按钮。适用于所有支持 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;
    }
  };
}
<input type='radio' class='radio-button' name='re'>
<input type='radio' class='radio-button' name='re'>
<input type='radio' class='radio-button' name='re'>

关于javascript - 如何取消选中选中的单选按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17120576/

相关文章:

javascript - 赋予 A 与 B 相同的值,但不使它们相互关联

php - 将标题保留在动态网站上

html - 用于转到 URL 的单选按钮

javascript - 获取单选按钮之前的状态点击事件/取消选中单选按钮(如果之前已选中)

jquery - 使用 jQuery 通用选择器取消选中单选按钮

javascript - $(窗口).resize() : Before

javascript - 如何在 $('body' ).append 脚本中添加年份显示脚本?

javascript - 如何在 Google map API 中仅显示公交路线[火车]?

javascript - 如果没有此警报框,为什么我的代码无法工作?

jquery - 使用 jQuery fadeIn/fadeOut 过渡,一次只有一个元素可见