Question

我正在尝试在ASP.NET MVC应用程序中使用JQuery UI Dialog插件。我的问题是当我加载页面时，Chrome控制台在jquery-ui-min.js文件中出现以下错误。

JQuery UI Dialog - Uncaught TypeError: Cannot call method 'getTitleId' of undefined

我正在布局页面中加载所有js和css文件。以下是我用于对话的JQuery事件。

$('.button').live('click', function () {
    $('.dialog').dialog('open');
});

$('.dialog').dialog({
    autoOpen: false,
    buttons: {
        'Ok': function () {
             $(this).dialog('close');
         }
    }
});

这两个事件位于单独的.js文件中，该文件也在布局页面中加载。（此文件正确加载，调试它。）

在我的部分视图中，我有一段html用于对话。

<input type="button" value="Add Value" class="button" /> 
<div class="dialog"> 
    I am dialog.
</div>

当我删除对话框的JQuery事件时，错误消失。

有什么想法吗？提前谢谢。

编辑：

下面是我的布局页面中的标签内部。

<head>
<meta charset="utf-8" />
<title>@ViewBag.Title </title>
<link href='http://fonts.googleapis.com/css?family=Cuprum' rel='stylesheet' type='text/css' />
<script type="text/javascript" src="../../Scripts/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery-ui.min.js"></script>
<link href="../../Content/Site.css" rel="stylesheet" type="text/css" />

<script type="text/javascript" src="../../Scripts/plugins/spinner/jquery.mousewheel.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/spinner/ui.spinner.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/wysiwyg/jquery.wysiwyg.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/wysiwyg/wysiwyg.image.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/wysiwyg/wysiwyg.link.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/wysiwyg/wysiwyg.table.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/flot/jquery.flot.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/flot/jquery.flot.orderBars.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/flot/jquery.flot.pie.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/flot/excanvas.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/flot/jquery.flot.resize.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/tables/jquery.dataTables.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/tables/colResizable.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/forms.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/autogrowtextarea.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/autotab.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/jquery.validationEngine-en.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/jquery.validationEngine.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/jquery.dualListBox.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/chosen.jquery.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/jquery.maskedinput.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/jquery.inputlimiter.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/forms/jquery.tagsinput.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/other/calendar.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/other/elfinder.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/uploader/plupload.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/uploader/plupload.html5.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/uploader/plupload.html4.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/uploader/jquery.plupload.queue.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.progress.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.jgrowl.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.tipsy.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.alerts.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.colorpicker.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/wizards/jquery.form.wizard.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/wizards/jquery.validate.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.breadcrumbs.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.collapsible.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.ToTop.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.listnav.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.sourcerer.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.timeentry.min.js"></script>
<script type="text/javascript" src="../../Scripts/plugins/ui/jquery.prettyPhoto.js"></script>

// This is the file in which my dialog events are located.
<script type="text/javascript" src="../../Scripts/custom.js"></script>
<meta name="viewport" content="width=device-width" />
</head>

Answer 1

我刚发现问题。

<script type="text/javascript" src="../../Scripts/plugins/spinner/ui.spinner.js"></script>

当我从<head>删除此行时，对话框开始起作用。这个文件确实存在。但是，我不知道为什么会这样。

JQuery UI对话框 - 未捕获的TypeError：无法调用未定义的方法'getTitleId'

1 个答案: