Bootstrap模式在阻止打开后不显示

问题描述：

我使用Bootstrap 3创建模式窗体。在用户点击按钮打开模式之前，有一个字段验证。Bootstrap模式在阻止打开后不显示

如果有效，则显示模态，否则会阻止显示模态。

问题出在第二次机会，用户点击按钮，模态将不会显示。如何解决这个问题？

代码显示模式，并防止模被所示：jsfiddle

$("#btnLookupClient").click(function (e) { 
    if ($("select[name='OfficeID'] option:selected").index() <= 0) { 
     alert("Please select office"); 
     $("#OfficeID").focus(); 
     $("#clientModal").on("show.bs.modal", function (e) { 
      return e.preventDefault() // stops modal from being shown 
     }); 
    } else { 
     var url = '@Url.Content("~/Client/Search?officeID=")' + $("#OfficeID").val(); 
     $.get(url) 
      .done(function (data) { 
       $("#lookup-client-container").html(data); 
       $("#clientModal").modal(show = true, backdrop = true); 
      }); 
    } 
});

你可以展示你的HTML和小提琴？ – 2014-09-24 10:08:09

@ Jake745'http：// jsfiddle.net/rsxb8tku /' – Willy 2014-09-24 10:20:06

答

使用one（）而不是on（）。

$("#clientModal").one("show.bs.modal", function (e) { 
      return e.preventDefault() // stops modal from being shown 
     });

在这里看到：http://jsfiddle.net/akcbj4n5/1/
参考：Difference between jQuery.one() and jQuery.on()

解决了，谢谢@Ankit。你为什么使用'debugger;'？ – Willy 2014-09-24 10:48:05

谢谢指出，它不是必需的。删除它。 – Ankit 2014-09-24 10:54:38

答

当警报被显示您绑定的preventDefault到显示模式，因此将不会被再次显示的情况下，即使验证通过。

我建议使用。一（）函数代替。对（）http://api.jquery.com/one/

而且你是模态的火，而不必因为你设置的切换来调用它的JavaScript模态和目标到模式ID。

Bootstrap模式在阻止打开后不显示

相关推荐