Question

我正在尝试使用Jquery对话框，但我得到的对象并不支持属性或方法对话框＆＃39;错误。将不胜感激任何指导。对话框功能现在是否已弃用。我使用的是jquery-1.5.2.min.js。这是我的代码：

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>    
    <script src="Scripts/jquery-1.5.2.min.js" type="text/javascript"></script>
    <script type="text/javascript" language="javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"></script>
    <style type="text/css">
        body {
            font: normal normal normal 10px/1.5 Arial, Helvetica, sans-serif;
        }

        .ui-dialog-osx {
            -moz-border-radius: 0 0 8px 8px;
            -webkit-border-radius: 0 0 8px 8px;
            border-radius: 0 0 8px 8px;
            border-width: 0 8px 8px 8px;
        }
    </style>
    <script type="text/javascript">
        $(document).ready(function () {
            var Button1 = $("#Button1");
            var Button2 = $("#Button2");
            var Panel1 = $("#Panel1");
            var dil = $("#dialog");
            Button1.click(function (e) {
                //Panel1.slideDown();
                e.preventDefault();
                $("#dialog").dialog({
                    modal: true,
                    draggable: false,
                    resizable: false,
                    position: ['center', 'top'],
                    show: 'blind',
                    hide: 'blind',
                    width: 400,
                    dialogClass: 'ui-dialog-osx',
                    buttons: {
                        "I've read and understand this": function () {
                            $(this).dialog("close");
                        }
                    }
                })
            });

            Button2.click(function (e) {
                Panel1.slideUp();
                e.preventDefault();
            });

        });
    </script>

</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:Button ID="Button1" runat="server" Text="Show Panel" />
            <asp:Button ID="Button2" runat="server" Text="Hide Panel" />

            <br />
            <br />

            <asp:Panel runat="server" ID="Panel1" Height="185px" Width="320px" Style="display: none;"
                BackColor="#FFFF99" BorderColor="Black" BorderStyle="Solid" BorderWidth="2px">
                Hello World!
            </asp:Panel>            
        </div>
        <div id="dialog" title="Important information">
                <span class="ui-state-default"><span class="ui-icon ui-icon-info" style="float: left; margin: 0 7px 0 0;"></span></span>
                <div style="margin-left: 23px;">
                    <p>
                        We're closed during the winter holiday from 21st of December, 2010 until 10th of January 2011.
            <br />
                        <br />
                        Our hotel will reopen at 11th of January 2011.<br />
                        <br />
                        Another line which demonstrates the auto height adjustment of the dialog component.
                    </p>
                </div>
            </div>
    </form>
</body>
</html>

Answer 1

你可能在这里犯了一个小错误：

<script src="Scripts/jquery-1.4.3.min.js" type="text/javascript"></script>
<script src="Scripts/jquery-1.5.2.min.js" type="text/javascript"></script>

我希望你的意思是包含jQuery，然后是包含dialog扩展名的脚本（可能是jQuery UI，或者是打包的子集）。

因此，请将脚本标记更改为...

<script src="Scripts/jquery-v.v.v.min.js" type="text/javascript"></script>
<script src="Scripts/jquery-ui-v.v.v.min.js" type="text/javascript"></script>

Answer 2

您在同一页面上包含两个版本的jquery，而您忘记包含jquery-ui：）

jQuery对话框 - 对象不支持属性或方法＆＃39;对话框＆＃39;

2 个答案: