javascript - 防止复选框在单击时取消选中（不禁用或只读）

Question

我正在使用一个复选框，我希望人们能够选中/取消选中它。但是，当他们取消选中它时，我正在使用 jQueryUI 模式弹出窗口来确认他们确实想要这样做。因此，他们可以单击OK或Cancel，并且我希望只有当他们单击时才取消选中我的复选框OK。
这就是为什么我想捕获 uncheck 事件以防止在视觉上未选中复选框，并在用户碰巧点击时以编程方式自行取消选中它OK。

我怎么能那样做？

PS：我知道如果用户点击后我可以重新检查它，Cancel但这会触发check我不想要的事件。

Answer 1

$("#checkboxID").on("click", function (e) {
    var checkbox = $(this);
    if (checkbox.is(":checked")) {
        // do the confirmation thing here
        e.preventDefault();
        return false;
    }
});

Answer 2

就像是：

$("#test").on('change', function() {
    this.checked=!this.checked?!confirm('Really uncheck this one ?'):true;
});
​

小提琴

Answer 3

纯 CSS 解决方案

选择复选框，例如 -

input[type="checkbox"] {
    pointer-events: none;
}

效果很好，现在您可以在您选择的任何元素点击上切换您的复选框。

Answer 4

使用 HTML disabled 属性怎么样？

<input type="checkbox" name="my_name" value="my_value" disabled> My value<br>

链接： https ://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled

Answer 5

   $("#checkboxID").click(function(e) { 
      var checkbox = $(this);
      if (checkbox.is(":checked")) {
       //check it 
      } else {
       // prevent from being unchecked
        this.checked=!this.checked;
      }
   });

Answer 6

$("#yourCheckBoxId").on('change',function(e){
    e.preventDefault();
    $("#yourPopDiv").popup();
});

preventDefault()将禁用您的默认行为input[type="checkbox"]

在你的弹出 div 上

$("#ok").on('click',function(){
    $("#yourCheckBoxId").attr("checked",true);
});