为啥第二次不打开引导模式对话框?

Posted

技术标签:

【中文标题】为啥第二次不打开引导模式对话框?【英文标题】:why does not open bootstrap modal dialog in the second time?为什么第二次不打开引导模式对话框? 【发布时间】:2014-07-20 03:15:46 【问题描述】:

我使用了一个通过单击按钮打开的引导模式对话框。 当我第一次点击按钮时,模态被打开;通过第二次单击,模式对话框不显示,此错误显示在 firebug consol 中:

TypeError: $(...).modal is not a function
$(".bs-modal-dialog").modal();

我该如何解决?谢谢...

这些是我的代码:

<div class="modal fade bs-modal-dialog" id="modalDialog" tabindex="-1" role="dialog" 
 aria-labelledby ="mySmallModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm">
    <div class="modal-content">
        <div class="modal-header">

                 <button class="close" aria-hidden="true" data-dismiss="modal" type="button">×</button>
                  <h4 id="mySmallModalLabel" class="modal-title"></h4>
        </div>
        <div class="modal-body">
        </div>
    </div>
</div>

<script>

function EditCompany(CoId)  


    var link="@Url.Action("EditCompany", "Companies", new  area = "AdminsArea", CoId = "-1")";

        link=link.replace("-1",CoId);
        $(".bs-modal-dialog").modal('show');
        $(".modal-body").load(link);
        $(".modal-content > .modal-header> #mySmallModalLabel").text("Edit Company");

 

                    <input type="button" name="EditCompany" value="Edit"  onclick="EditCompany(@co.CompanyID)" class="btn btn-success"/>

【问题讨论】:

你是否包含了具有bs-modal-dialog的支持js? 请注意:不要在 onClick 属性中使用内联 js 代码。在你的 js 代码中绑定一个事件。 @Java_User 是的,我已经添加了 bootstrap.min.js,但是 bs-modal-dialog 是我的自定义类名。 【参考方案1】:

你不需要任何 javascript 来做到这一点,Bootstrap 已经自带了 html attribute for that。

您所要做的一切包括data-toggle="modal" data-target="#myModal",它应该会触发您的模式。

bootply here

【讨论】:

以上是关于为啥第二次不打开引导模式对话框?的主要内容,如果未能解决你的问题,请参考以下文章

如何使用引导对话框作为 vueJs 组件?

使用引导程序关闭 angular.js 中的所有对话框

如何在引导程序中的页面加载时打开模式对话框

在引导模式打开时调用函数

单击右上角的关闭(x)按钮后,DOJO 对话框未第二次打开

jQuery UI Dialog第二次没有打开