猿问

jQuery复选框更改并单击事件

jQuery复选框更改并单击事件

$(document).ready(function() {
  //set initial state.
  $('#textbox1').val($(this).is(':checked'));

  $('#checkbox1').change(function() {
    $('#textbox1').val($(this).is(':checked'));
  });

  $('#checkbox1').click(function() {
    if (!$(this).is(':checked')) {
      return confirm("Are you sure?");
    }
  });});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><input type="checkbox" id="checkbox1"/><br /><input type="text" id="textbox1"/>


有只小跳蛙
浏览 705回答 3
3回答

12345678_0001

好吧，我没有看到与我匹配的答案，所以我会发布这个。在JSFiddle中测试并执行您要求的操作。当单击与复选框关联的标签时，此方法具有触发的额外好处。原答案：$(document).ready(function()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;//set&nbsp;initial&nbsp;state. &nbsp;&nbsp;&nbsp;&nbsp;$('#textbox1').val($(this).is(':checked')); &nbsp;&nbsp;&nbsp;&nbsp;$('#checkbox1').change(function()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if($(this).is(":checked"))&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;returnVal&nbsp;=&nbsp;confirm("Are&nbsp;you&nbsp;sure?"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(this).attr("checked",&nbsp;returnVal); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$('#textbox1').val($(this).is(':checked'));&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;});});更新答案：$(document).ready(function()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;//set&nbsp;initial&nbsp;state. &nbsp;&nbsp;&nbsp;&nbsp;$('#textbox1').val(this.checked); &nbsp;&nbsp;&nbsp;&nbsp;$('#checkbox1').change(function()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if(this.checked)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;returnVal&nbsp;=&nbsp;confirm("Are&nbsp;you&nbsp;sure?"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(this).prop("checked",&nbsp;returnVal); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$('#textbox1').val(this.checked);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;});});
0

子衿沉夜

演示使用&nbsp;mousedown$('#checkbox1').mousedown(function()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(!$(this).is(':checked'))&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.checked&nbsp;=&nbsp;confirm("Are&nbsp;you&nbsp;sure?"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(this).trigger("change"); &nbsp;&nbsp;&nbsp;&nbsp;}});
0
随时随地看视频慕课网APP

相关分类

JQuery
JavaScript
我要回答