Question

我收到了这个错误：

Uncaught TypeError: Object [object Object] has no method 'dialog'

这是我的相关HTML

<!DOCTYPE html>
<html lang="en">
    <head>
        <script src="/Scripts/modernizr-2.0.6-development-only.js"></script>
    </head>
<body>
    <div id="deleteConfirmationDialog" title="Confirm Withdrawl">
            Are you sure?
    </div>
    <div class="appl-appliedfor">
        <a class="deleteLink" href="/Applicant/WithdrawApplication/2">  
            <img class="appl-withdrawApplication"
            src="/Content/Images/Delete.png" alt="Withdraw Application" />
        </a>
    </div>

    <script src="/Scripts/Prime/jquery-1.8.2.min.js"></script>
    <script src="/Scripts/Jqueryui/jquery-ui-1.9.2.custom.min.js"></script>
    <script src="/Scripts/OnBoard/jquery-form-min.js"></script>
    <script src="/Scripts/Prime/bootstrap.min.js"></script>
    <script src="/Scripts/Prime/json2.js"></script>
    <script src="/Scripts/Prime/selectivizr-min.js"></script>
    <script src="/Scripts/Prime/jquery.cookie.js"></script>
    <script src="/Scripts/Prime/jquery.maskedinput-1.3.min.js"></script>
    <script src="/Scripts/OnBoard/OnBoardAll.js"></script>
    <script src="/Scripts/OnBoard/ApplicantAll.js"></script>


    <script src="/Scripts/jquery.unobtrusive-ajax.js"></script>
    <script src="/Scripts/jquery.validate.js"></script>
    <script src="/Scripts/jquery.validate.unobtrusive.js"></script>
    <script src="/Scripts/MvcFoolproofJQueryValidation.min.js"></script>
    <script src="/Scripts/mvcfoolproof.unobtrusive.min.js"></script>


    <script src="/Scripts/jqueryui/jquery.ui.dialog.js"></script>

    <script type="text/javascript">
    $(document).ready(function() {
        $('#deleteConfirmationDialog').dialog({
            autoOpen: false,
            modal: true
        });
    });

    $('.deleteLink').click(function(e) {
        $('#deleteConfirmationDialog').dialog({
            buttons: {
                "Yes - Withdraw Application": function() {
                    $(this).dialog("close");
                },
                "No - Do Nothing": function() {
                    e.preventDefault();
                    $(this).dialog("close");
                }
            }
        });
        $('#deleteConfirmationDialog').dialog("open");
    });
</script>


    <script type="application/json" id="__browserLink_initializationData">
        {"appName":"Chrome","requestId":"28b6a62eb1fb42829a3191b7c3e270d4"}
    </script>
    <script type="text/javascript" 
src="http://localhost:61108/d90608e9d0044daf98eb343c1b3769d7/browserLink" 
async="async"></script>
</body>
</html>

我搜索错误的地方是因为你必须包含jquery和jquery UI。我尝试过使用和不使用jquery.ui.dialog的JQuery UI。没有运气。

我错过了什么？谢谢你的阅读。

修改

错误指向此行：

$(document).ready(function() {
    $('#deleteConfirmationDialog').dialog({

如果我在控制台中键入$ .dialog，我会得到未定义的

如果我引用jquery.ui.dialog.js，则会出现以下错误：

Uncaught TypeError: Object function (a, b) { return new p.fn.init(a, b, c) } has no method 'widget'

否则没有其他错误。

我得到200 OK。

我已将显示的javascript代码移除到自己的文件中并最后引用它。我还将document.ready事件函数之外的函数移动到此函数内部，仍然得到相同的错误。

我可以在Sources选项卡中看到jquery-ui和jquery。

我不明白为什么我可以在sources选项卡中看到jqueryui，但在控制台中键入$ .dialog导致未定义

Answer 1

只有不使用外部库的代码和不使用DOM的代码才能直接在<script>标记中执行。

如果直接在<script>标记中搜索DOM元素而不等待Document / DOM准备就绪，那么您搜索的元素可能尚不存在（在DOM中）或者它们可能不完整

直接在<script>标记中使用JavaScript方法而不等待Document / DOM准备就绪，外部文件可能尚未下载，这意味着这些外部文件中的方法可能尚不存在。< / p>

为了确保不会出现这种情况，您需要将代码放在事件处理程序中 - 这样可以确保仅在触发事件后才执行代码。必要的事件$(document).ready(event_handler_function)也缩短为$(event_handler_function).。

对象没有方法'对话'

1 个答案: