如何使用onclick防止引导模式从按钮关闭？

Question

我有模有按钮（保存）

<button type="button" class="btn btn-success btn-sm" data-dismiss="modal" onclick="do_save()">Save 
    </button> 

如何预防收盘时do_save()功能失败了吗？ （例如，当一些数据无法验证）

Answer 1

不要使用data-dismiss="modal"，让你的函数close（隐藏）您的模式：

<button type="button" class="btn btn-success btn-sm" onclick="do_save()">Save</button> 

“

function do_save() 
    { 
     if(Math.floor(Math.random() * 2)==1) 
     { 
      console.log('success'); 
      $('#myModal').modal('hide'); 
      return; 
     } 
     console.log('failure'); 
     return false; 
    } 

Answer 2

由于您使用jQuery的反正尽量不要有使用Javascript/jQuery的嵌入代码

$('#buttonId').on('click', function() { 
    // either call do_save or embed the contents of do_save in here 
    var myDataIsValid = true; // change to call validator function 
    if (myDataIsValid) { 
    $('#myModal').modal('hide'); 
    } 
    return true; // value depends on whether you want stopPropagation or not. 
}); 

HTML：

<button id="buttonId" type="button" class="btn btn-success btn-sm">Save</button> 

作为一种替代方法，您可以通过拦截'hide'事件并从中返回false来阻止关闭。

Answer 3

如果赶上从按钮的点击事件是这样的：

 $('#buttonId').off('click').click(function(clickEvent){ 
     //enter code here 
    }); 

实际上，你可以防止你的模式的结束。为此，根据您的情况，你会发现这两个功能非常有用：

 clickEvent.preventDefault(); 
    clickEvent.stopPropagation(); 

如果我理解的这个网站（在德国） http://www.mediaevent.de/javascript/event-handler-default-verhindern.html 正确，preventDefault（）方法停止立即默认动作（如跟随一个链接）。然而，事件本身仍然会遍历DOM，并且可以被各种事件监听器“听到”，其中之一是隐藏模式的事件监听器。为此，需要第二个功能，它可以阻止事件在DOM中的传播。因此，隐藏监听器无法听到该窗口，窗口也不会关闭（隐藏）。因此，我建议实行像这样的功能：

 $('#buttonId').off('click').click(function(clickEvent){ 
     //enter code here 
     var myDataIsValid = true; 
     // check if Data is valid => myDataIsValid = true or false 
     if(myDataIsValid){ 
     //do Stuff 
     }else{ 
     clickEvent.preventDefault(); 
     clickEvent.stopPropagation(); 
     //do other Stuff 
     } 
    }); 

在我的代码，我只需要使用stopPropagation（），为我的默认行为是需要的，因此您可以单独使用这两种功能。

注意：此解决方案仅用Firefox浏览器进行测试