jQuery复选框更改并单击事件

$(document).ready(function(){
//设置初始状态。
$('#textbox1').val($(this).is(':checked');
$('#checkbox1')。更改(函数(){
$('#textbox1').val($(this).is(':checked');
});
$('#复选框1')。单击(函数(){
如果(!$(this).is(':checked')){
返回确认(“您确定吗?”);
}
});
});
<脚本src=”https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js“&gt&lt/脚本>
<输入type=“checkbox”id=“checkbox1”/&gt&书信电报;br/>
<输入type=“text”id=“textbox1”/&gt

此处.change()使用复选框状态更新文本框值。我使用。单击()。如果用户选择取消,则复选标记将恢复,但在确认前会触发.change()

这会使事情处于不一致的状态,选中复选框时文本框会显示false

如何处理取消并使文本框值与检查状态保持一致

这种方法还有一个额外的好处,就是在单击与复选框关联的标签时触发

更新答案:

$(文档).ready(函数(){
//设置初始状态。
$('#textbox1').val(this.checked);
$('#checkbox1')。更改(函数(){
如果(选中此项){
var returnVal=确认(“您确定吗?”);
$(this).prop(“选中”,returnVal);
}
$('#textbox1').val(this.checked);
});
});

原始答案:

$(文档).ready(函数(){
//设置初始状态。
$('#textbox1').val($(this).is(':checked');
$('#checkbox1')。更改(函数(){
如果($(this).is(“:checked”)){
var returnVal=确认(“您确定吗?”);
$(this.attr(“checked”,returnVal);
}
$('#textbox1').val($(this).is(':checked');
});
});

发表评论