javascript - 使用 jQuery 破解单选按钮行为(取消选中组)

标签 javascript jquery html radio-button

对于一个项目,我需要在一个组中使用两个单选按钮,并且需要在单击时取消选中选中的单选按钮。

我已经尝试过类似的方法,但这不起作用:

$(document).ready(function() {
    $("input[type='radio']:checked").click(function(e) {
        e.preventDefault();
        $(this).prop("checked", false);
        alert('Hello World!');
    });
});

当我单击选中的单选按钮时,它甚至不会发出警报。

每当我在控制台中调用它时:

$("input[type='radio']:checked").prop('checked', false);

它确实取消选中选中的单选按钮,因此该部分应该可以工作。

最佳答案

实际上,当您使用click时,不会发生这种情况,请改用mousedown

附上工作片段

$(function(){
  $('#wrapper').on('mousedown', 'input[type=radio]',function(e){
	if(!$(e.target).is(':checked')){
		return true;
	}
	e.preventDefault();
    $(this).prop("checked", false);
    alert('Hello World!');
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="wrapper">
	<input type=radio name=hello />
	<input type=radio name=hello />
	<input type=radio name=hello checked/>
</div>

关于javascript - 使用 jQuery 破解单选按钮行为(取消选中组),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32074384/

相关文章:

javascript - 使用数据属性通过 Jquery 定位和更新变量

javascript - 使用 canvas 和 javascript 的嵌套动画

javascript - 提取大括号之间的字符串但排除一些

javascript - 在 html 中的按钮上定位图像/对象

javascript - 如何在其他 HTML 元素上显示 <section> 标签

javascript - 使用 ES6 Promises 惯用地处理前置条件

javascript - 如何将表单数据存储在本地存储中?

javascript - 动态添加、验证和删除表单字段集

html - 为什么我网站的某些元素在多个浏览器中的位置不同?

javascript - 从输入中删除重复的空格