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

嗨，我是第一次使用Bootstrap，我无法通过单击submit按钮使我的模式表单保持打开状态。 我搜索了这么多，但所有相关的问题都涉及稍微不同的问题（下面的例子）

看一下=>

使用

或

编辑1：

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

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

编辑2：

移除以下各项：

data-dismiss = "modal"

从不应关闭对话框的按钮。之后，可以使用$（“#TheDialogID”）.modal（“隐藏”）关闭对话框。例如：

<!--<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>-->

---

这就是我在我的程序中所做的，希望能有所帮助

这是触发模式的按钮。在这里，我已经禁用键盘和鼠标点击以外的模式

<button type="button" data-toggle="modal" data-target="#modalDivId"
                data-backdrop="static" data-keyboard="false">

最后，单击submit按钮时触发的函数。此处

event.preventDefault（）将阻止表单提交的默认操作，因此模式将保持不变

function myFunction() {
    $("form").on("submit", function (event) {
        event.preventDefault();
        $.ajax({
            url: "yoururl",
            type: "POST",
            data: yourData,
            success: function (result) {
                console.log(result)
            }
        });
    })
}

我遇到了类似的问题，在这里我使用modal作为表单，因此我无法首先设置
data background=“static”data keyboard=“false”
，因为我希望用户能够关闭它，只要他没有提交表单。一旦他提交了表单，我想阻止他关闭表单。这是我可以四处走动的方式

$('#modalForm').on('submit', function() {
  $(#modal).on('hide.bs.modal', function ( e ) {
    e.preventDefault();
  }) 
});

仅使用以下代码：-

enter $(document).ready(function () {
$("#myModal").modal('show');

}))

并在更新面板中编写html代码，然后从按钮中删除data dismission=“modal”。希望它对您有用。
如果您想添加多个数据，并且希望modal保持开放状态，请使用




如果要在提交数据后关闭模式，则必须使用




使用此选项可防止引导模式窗口在表单提交时关闭

$( "form" ).submit(function( event ) {
  event.preventDefault();
});

您是通过ajax提交表单，还是只是一个普通的提交表单？@Apostolov，感谢您的快速回复！我没有使用ajax。Ajax不会发回页面，因为我确实想在提交时发回，我想我不应该发回。@apostolov我也有同样的问题，我正在使用Ajax我该怎么办？嗨@ZooL，谢谢你的建议。我已经尝试了这两种方法，奇怪的是，JS有效，而标记无效。然而，JS路径并没有完全切断它，因为模式窗口显示在页面加载上，而不是在链接单击上。@dura请查看我的编辑您是否尝试过编辑？我注意到您删除了双引号，但我仍然认为它不起作用，因为href必须设置为模式窗口的id。@dura您必须尝试。单击链接时会发生onclick事件。我已经在@ZooL上尝试过了。单击“提交”按钮后，窗口仍将关闭。我曾尝试将onclick事件添加到该按钮中，但这也不起作用。如果您能在代码中添加一些解释，那就太好了。如果你只写指令，学习效果会大大降低。这就是我想说的：解释：-谢谢，今天的英雄！
function myFunction() {
    $("form").on("submit", function (event) {
        event.preventDefault();
        $.ajax({
            url: "yoururl",
            type: "POST",
            data: yourData,
            success: function (result) {
                console.log(result)
            }
        });
    })
}

$('#modalForm').on('submit', function() {
  $(#modal).on('hide.bs.modal', function ( e ) {
    e.preventDefault();
  }) 
});

enter $(document).ready(function () {
$("#myModal").modal('show');

$( "form" ).submit(function( event ) {
  event.preventDefault();
});