弹出窗口用于选中/取消选中复选框

时间:2016-10-24 12:50:51

标签: javascript jquery checkbox

我提示在勾选并取消勾选框时会生成弹出窗口。看起来有一行冗余代码,但删除后,功能不再有效。所以也许不那么多余:-)但是#id与任何东西都不匹配(目前设置为不匹配的CAPS)

为什么这会干扰?

$('#checkbox').click(function() {
  if ($("#checkbox").is(':checked')) {
    if (confirm('Are you sure you want to CONFIRM the order?')) {
      $('#CHECKBOX').click();
    }
  }
});

$("#checkbox").on('change', function() {
  this.checked = !this.checked ? !confirm('Do you really want to change this to NOT RECEIVED?') : true;
});

http://jsfiddle.net/5nd1wj54/1/

2 个答案:

答案 0 :(得分:0)

使用类而不是id,所以现在需要冗余代码。您可以在HTML元素的data属性中存储信息。 jsFiddle

我已经为每个应该检查的复选框添加了一个类。

$(".checkIt").on('change', function() {
  if ($(this).is(':checked')) {
    confirm('Do you really want to change ' + $(this).data('id') + ' to NOT RECEIVED?');
  }
});

<强> HTML

<input type="checkbox" data-id="checkbox1" class="checkIt" />
<input type="checkbox" data-id="checkbox2" class="checkIt" />
<input type="checkbox" data-id="checkbox3" class="checkIt" />

答案 1 :(得分:0)

这就是我认为你的意思

$('#checkbox').click(function() {
  if (this.checked) {
    this.checked = confirm('Are you sure you want to CONFIRM the order?')); 
  }    
  else {
    this.checked = !confirm('Do you really want to change this to NOT RECEIVED?'); 
  }  
});