触发单击单选按钮可在切换前检查条件
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了触发单击单选按钮可在切换前检查条件相关的知识，希望对你有一定的参考价值。
对于有点模糊的标题感到抱歉，但我会尝试更好地解释。我在this codepen中写了一些快速代码来显示我的问题。
基本上，我的codepen有两个切换按钮，“男性”和“女性”轻松。我还有一个按钮和一个点击监听器：$('#doClick').click(function() {...}。
单击该按钮时，单击侦听器通过调用$("#female").click();来切换女性按钮
我的问题是，当页面首次加载并且默认选择“男性”时，按下按钮会更改切换按钮，但它仍会在控制台中吐出“男性已检查”。基本上，在单选按钮实际切换到“女性”之前，会检查单击侦听器中的if条件。
这是更大的代码片段的一部分，根据当前选择的内容执行不同的代码，因此在我的代码中，由于切换和条件检查的时间，正在执行错误的代码。
我希望我的问题得到很好的描述。
我想知道是否有人知道为什么会这样，我能做些什么来解决这个问题？以下代码修复了此问题：
$('#male').click(function() {
console.log("Male was checked")
});
$('#female').click(function() {
console.log("Female was checked")
});
但我不确定是否需要两个不同的点击监听器，并且想知道是否有更好的解决方案。
谢谢
您的原始代码几乎拥有它，只需要更改绑定以使用change而不是click用于无线电
$('#male, #female').on('change', function() {
console.log("A click was registered");
if($("#male").is(":checked")) {
console.log("Male is checked");
} else if($("#female").is(":checked")) {
console.log("Female is checked");
}
});
我更喜欢你检查哪个盒子被检查，以便你设置一个女性或男性来检查负载，你的代码仍然可以正常工作。
关于jquery change的文档
将事件处理程序绑定到“更改”javascript事件，或在元素上触发该事件
https://api.jquery.com/change/
你可以绑定一个自定义事件，并在事件“click”的编程调用之后调用它。
如果您确实需要以编程方式执行qazxsw poi事件，则此方法很有用。
即：
click$('#female').on('radiobuttonChecker', function() {
if($("#male").is(":checked")) {
console.log("Male is checked");
} else if($("#female").is(":checked")) {
console.log("Female is checked");
}
});
$('#male, #female').click(function(e) {
console.log("A click was registered");
});
$('#female').on('radiobuttonChecker', function() {
if($("#male").is(":checked")) {
console.log("Male is checked");
} else if($("#female").is(":checked")) {
console.log("Female is checked");
}
});
$('#doClick').click(function() {
$("#female").click();
$("#female").trigger('radiobuttonChecker');
})您需要使用<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" name="gender" value="male" id="male" checked> Male<br>
<input type="radio" name="gender" value="female" id="female"> Female<br>
<button id="doClick">Click</button>事件：
change以上是关于触发单击单选按钮可在切换前检查条件的主要内容，如果未能解决你的问题，请参考以下文章