尽管使用了preventDefault,复选框仍然未被选中

时间:2019-01-31 09:58:58

标签: javascript jquery

getInfo()返回false时,将抛出窗口alert,但是该复选框仍被更改;检查是否未选中,反之亦然。

有帮助吗?

$("input[type='checkbox']").click(function(event) {
  var someCondition = getInfo();
  if (someCondition === false) {
    event.preventDefault();
    window.alert("Nope");
    return false;
  }
});

function getInfo() {
  return false; // just for testing
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" />

2 个答案:

答案 0 :(得分:0)

如果我正确理解了您的需求,则可以使用此

  $("input[type='checkbox']").click(function (event) {
         var someCondition = getInfo();
         if(someCondition === false) {
            var checkVal = $("input[type='checkbox']").val();
             $("input[type='checkbox']").attr( "checked", !checkVal );
             window.alert("Nope");

         }
     });

或者如果您的条件为假,则希望取消选中复选框

  $("input[type='checkbox']").click(function (event) {
         var someCondition = getInfo();
         if(someCondition === false) {
             $("input[type='checkbox']").attr( "checked", false);
             window.alert("Nope");

         }
     });

希望有帮助

答案 1 :(得分:0)

您的代码似乎可以正常工作,但是其他某些插件可能会干扰这种行为。不过,请尝试以下方法,看看能否解决问题

 $("input[type='checkbox']").on('click',function (event) {
        var someCondition = getInfo();
        var checkBox = $(this);
        if(someCondition === false) { 
            event.preventDefault();
            checkBox.prop('checked', !checkBox.prop('checked'))
            window.alert("Nope");
            return false;
        }
    });