我有以下 HTML 代码:
<label class="radio">
<input type="radio" name="msgTo" value="optiona" checked="checked">
<i></i>Option A</label>
<label class="radio">
<input type="radio" name="msgTo" value="optionb">
<i></i>Option B</label>
<label class="radio">
<input type="radio" name="msgTo" value="optionc">
<i></i>Option C</label>
<label class="radio">
<input type="radio" name="msgTo" value="optiond">
<i></i>Option D</label>
<label class="radio">
<input type="radio" name="msgTo" value="optione">
<i></i>Option E</label>
我正在尝试根据使用此代码检查的选项来执行操作:
$('input[name="msgTo"]:checked').on('change', function() {
alert('option changed');
if ($('input[name="msgTo"]:checked').val() == 'optionc') {
$('#outsideMsgWarning').show();
$('#destEspecificos').hide();
$('#locEspecificas').hide();
} else if ($('input[name="msgTo"]:checked').val() == 'optiond') {
$('#outsideMsgWarning').show();
$('#destEspecificos').hide();
$('#locEspecificas').show();
$('.my_select_box').trigger('chosen:updated');
} else if ($('input[name="msgTo"]:checked').val() == 'optione') {
$('#outsideMsgWarning').show();
$('#destEspecificos').hide();
$('#locEspecificas').hide();
} else if ($('input[name="msgTo"]:checked').val() == 'optionb') {
$('#outsideMsgWarning').hide();
$('#destEspecificos').show();
$('#locEspecificas').hide();
$('.my_select_box').trigger('chosen:updated');
} else {
$('#outsideMsgWarning').hide();
$('#destEspecificos').hide();
$('#locEspecificas').hide();
$('.my_select_box').trigger('chosen:updated');
}
});
当我选择第二个、第三个、第四个或第五个选项时，没有任何反应(应该隐藏/显示一些选项)，但是当我返回第一个选项(这将是 javascript 中的 ELSE)时，会显示警报。该警报仅用于测试目的。
我还尝试在复选框名称中添加方括号 []，但得到了相同的结果。
为什么 JavaScript 不能检测到每一个变化？
提前致谢!!!
最佳答案
设置事件绑定(bind)的初始选择器仅查找选中的单选按钮:
$('input[name="msgTo"]:checked').on('change', function() {
由于默认情况下会预先选中第一个单选按钮，因此只有该单选按钮会受到影响。
将行更改为:
$('input[name="msgTo"]').on('change', function() {
以便组中的所有单选按钮都绑定(bind)到事件处理程序。
关于javascript - 使用 JavaScript 检测复选框更改时的奇怪行为，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43785454/