防止引导模式窗口在表单提交时关闭

Question

嗨，我是第一次使用 Bootstrap，我无法让我的模态表单在单击提交按钮时保持打开状态。我搜索过 SO 但所有相关问题都处理略有不同的问题（下面的示例）。

禁止关闭 Twitter 引导模式窗口

原文由 U r s u s 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

看看 => http://getbootstrap.com/2.3.2/javascript.html#modals

利用

data-backdrop="static"

或者

$("#yourModal").modal({"backdrop": "static"});

编辑 1：

在您的链接上打开您的模式 ==>

 <a href="#" onclick="$('#yourModal').modal({'backdrop': 'static'});" class="btn btn-primary">yourModal</a>

编辑2：

http://jsfiddle.net/BVmUL/39/

原文由 ZooL 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

删除以下内容：

 data-dismiss = "modal"

从不应关闭对话框的按钮。之后，您可以使用 $( “#TheDialogID” ).modal( “hide” ) 关闭对话框。例子：

 <!--<SimpleModalBox>-->
<div class="modal fade" id="SimpleModalBox" tabindex="-1" role="dialog" aria-labelledby="SimpleModalLabel" aria-hidden="true">
  <!--<modal-dialog>-->
  <div class = "modal-dialog">

    <!--<modal-content>-->
    <div class = "modal-content">

      <div class = "modal-header">
        <button type = "button" class = "close" data-dismiss = "modal">
          <span aria-hidden="true">&times;</span>
        </button>
        <h4 class = "modal-title" id = "SimpleModalLabel">Title for a simple modal</h4>
      </div>

      <div id="TheBodyContent" class = "modal-body">
        Put your content here
      </div>

      <div class = "modal-footer">
        <button type = "button" class = "btn btn-default" data-dismiss = "modal">Yes</button>
        <button type = "button" class = "btn btn-default" onclick="doSomethingBeforeClosing()">Don't close</button>
        <button type = "button" class = "btn btn-default" data-dismiss = "modal">Cancel</button>
      </div>

    </div>
    <!--<modal-content>-->

  </div>
  <!--/modal-dialog>-->
</div>
<!--</SimpleModalBox>-->

脚本代码：

 //#region Dialogs
function showSimpleDialog() {
  $( "#SimpleModalBox" ).modal();
}

function doSomethingBeforeClosing() {
  //Do something. For example, display a result:
  $( "#TheBodyContent" ).text( "Operation completed successfully" );

  //Close dialog in 3 seconds:
  setTimeout( function() { $( "#SimpleModalBox" ).modal( "hide" ) }, 3000 );
}
//#endregion Dialogs

原文由 Jelgab 发布，翻译遵循 CC BY-SA 3.0 许可协议