twitter-bootstrap 模态错误 - 未捕获的类型错误：未定义不是模态函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/24978937/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Modal error - Uncaught TypeError: undefined is not a function modal
提问by 07_05_GuyT
Im using the following code and I got error in delete in the JS($("#deleteModal").modal("show");),any idea what can be wrong here ?
Im using MVC5 project
我使用以下代码，但在删除时出错JS($("#deleteModal").modal("show");），知道这里有什么问题吗？我正在使用 MVC5 项目
the error is
错误是
Uncaught TypeError: undefined is not a function
未捕获的类型错误：未定义不是函数
<!-- Modal -->
<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="deleteModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title" id="deleteModalLabel">Delete Item</h4>
</div>
<div id="deleteModalBody" class="modal-body"></div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<script>
$(function () {
$("#deleteModal").modal("hide"); // initially hides the modal pop-up until needed
$(".deleteLink").on("click", function () {
$.get('@Url.Action("GetDeletePartial")', { id: $(this).prop("id") }, function (data) {
$("#deleteModalBody").html(data);
$("#deleteModal").modal("show"); // shows the modal pop-up now that we have our partial view
});
});
});
</script>
when I try it like following it fail in the begging of the script with the same error
当我像跟随它一样尝试它时，它在脚本的乞求中失败了同样的错误
@section scripts
{
<script src="~/Scripts/jquery-2.1.1.min.js"></script>
<script>
$(function () {
$("#deleteModal").modal("hide"); // initially hides the modal pop-up until needed
$(".deleteLink").on("click", function () {
$.get('@Url.Action("GetDeletePartial")', { id: $(this).prop("id") }, function (data) {
$("#deleteModalBody").html(data);
$("#deleteModal").modal("show"); // shows the modal pop-up now that we have our partial view
});
});
});
</script>
}
回答by Jijie Chen
It seems that you are attempting to make a model dialog using some third-party jQuery plugin, but you foget to make a reference to that plugin's javascript file.
您似乎正在尝试使用某些第三方 jQuery 插件制作模型对话框，但您忘记引用该插件的 javascript 文件。
To confirm this, i wonder which line does the exception occurs on? Is it on the line of first line of your ready callback?
为了确认这一点，我想知道异常发生在哪一行？它在你准备好的回调的第一行吗？
$("#deleteModal").modal("hide");
$("#deleteModal").modal("隐藏");
If so, please check your script reference. Just add a <script> tag with a src to that file before your script block.
如果是这样，请检查您的脚本参考。只需在脚本块之前向该文件添加一个带有 src 的 <script> 标记。
Update:
更新：
As you comments, the exception does not occurs on that line. So you may use a debugger(such as Chrome developer tools) to find out which function-call fails. You can set the debugger to pause the excution on exceptions. In chrome developer tools, you can switch to Source tab and click the last icon on right-top of the side-bar on the right to enable this feature. Here's an awesome answer with snapshots: https://stackoverflow.com/a/17324511/1817042
正如您所评论的，该行不会发生异常。因此，您可以使用调试器（例如 Chrome 开发人员工具）来找出哪个函数调用失败。您可以将调试器设置为在异常时暂停执行。在 Chrome 开发者工具中，您可以切换到 Source 选项卡并单击右侧边栏右上角的最后一个图标以启用此功能。这是一个很棒的快照答案：https: //stackoverflow.com/a/17324511/1817042
回答by Bruno
Had the same error on standalone plain old HTML+Javascript page.
在独立的纯旧 HTML+Javascript 页面上有同样的错误。
Apparently caused by socket.io.js which script tag was initially placed after jquery and bootstrap.js script tags.
显然是由 socket.io.js 引起的，该脚本标签最初放置在 jquery 和 bootstrap.js 脚本标签之后。
Moving socket.io.js script tag before jquery and bootstrap resolved the issue for me.
在 jquery 和 bootstrap 之前移动 socket.io.js 脚本标签为我解决了这个问题。
