jquery – 对象不支持属性或方法’对话’

参考 AjaxControlToolkit,我从MVC创建了一个UI对话框.

Layout.cshtml

<head>
   <Meta charset="utf-8" />
   <title>@ViewBag.Title - My ASP.NET MVC Application</title>
   <link href="../../Content/smoothness/jquery-ui-1.10.2.custom.css" rel="stylesheet" type="text/css" />
   <script src="../../Scripts/jquery-1.9.1.js" type="text/javascript"></script>
   <script src="../../Scripts/jquery-ui-1.10.2.custom.min.js" type="text/javascript"></script>
   <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
   <Meta name="viewport" content="width=device-width" />
   @Styles.Render("~/Content/css")
   @Scripts.Render("~/bundles/modernizr")
</head>

Index.cshtml

<h2>jQuery UI Hello World</h2>          
<button id="show-dialog">Click to see jQuery UI in Action</button>            
<div id="dialog" title="jQuery UI in ASP.NET MVC" >  
  <p>You now have the power of ASP.NET,the simplicity of client-side scripting with jQuery,and the looks of jQuery UI. Congrats,web slinger!</p>  
</div>  

<script language="javascript" type="text/javascript">
  $(function () {
    $('#dialog').dialog({
      autoOpen: false,width: 600,buttons: {
        "Ok": function () { $(this).dialog("close"); },"Cancel": function () { $(this).dialog("close"); }
      }
    });
    $("#show-dialog").button().click(function () {
        $('#dialog').dialog('open');
        return false;
    });
  });  
</script>

我在IE和Firefox中检查过. Firefox抛出

Typeerror $(…).dialog is not a function

IE抛出

Object doesn’t support property or method ‘dialog’

有什么建议？

解决方法

我想到的有三点可能值得检查：

>永远不要在ASP.NET MVC应用程序中硬编码URL.始终使用帮助程序(或推荐的程序包)：

<head>
    <Meta charset="utf-8" />
    <title>@ViewBag.Title - My ASP.NET MVC Application</title>
    <link href="~/Content/smoothness/jquery-ui-1.10.2.custom.css" rel="stylesheet"  type="text/css" />
    <script src="~/Scripts/jquery-1.9.1.js" type="text/javascript"></script>
    <script src="~/Scripts/jquery-ui-1.10.2.custom.min.js" type="text/javascript"></script>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <Meta name="viewport" content="width=device-width" />
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
</head>

>确保在_Layout.cshtml的末尾没有@Scripts.Render(“〜/ bundles / jquery”)调用,因为这将包括jQuery两次.
>如果在_Layout.cshtml的末尾有一个专用的部分用于自定义脚本,如@RenderSection(“scripts”,required：false),请确保已将自定义脚本放在该部分中(请注意,因为此RenderSection是在DOM的末尾,您不需要将您的脚本包装在document.ready事件中,因为在执行时,DOM已经被加载了)：

<h2>jQuery UI Hello World</h2>          
<button id="show-dialog">Click to see jQuery UI in Action</button>            
<div id="dialog" title="jQuery UI in ASP.NET MVC" >  
   <p>You now have the power of ASP.NET,web slinger!</p>  
</div>    

@section scripts {
    <script type="text/javascript">
        $('#dialog').dialog({
            autoOpen: false,buttons: {
                "Ok": function () { $(this).dialog("close"); },"Cancel": function () { $(this).dialog("close"); }
            }
        });
        $("#show-dialog").button().click(function () {
            $('#dialog').dialog('open');
            return false;
        });
    });  
    </script>
}

jquery – 对象不支持属性或方法’对话’

解决方法

猜你在找的jQuery相关文章