使jQuery ui对话框无法工作？

Question

这里有一些代码，可以使用jquery生成一个对话框。

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;
    }

图书馆

<script type="text/javascript" src="scripts/jquery-1.11.0.js"></script>
<script type="text/javascript" src="scripts/jquery.cookie.js"></script>
<script type="text/javascript" src="scripts/jquery-1.10.2.js"></script>
<script type="text/javascript" src="scripts/jquery-ui-1.10.4.custom.js"></script>
<script type="text/javascript" src="scripts/jquery-ui-1.10.4.custom.min.js"></script>

JS

$("#dialog-message").dialog({
    modal: true,
    draggable: true,
    resizable: true,
    position: ['center', 'top'],
    show: 'blind',
    hide: 'blind',
    width: 400,
    dialogClass: 'ui-dialog-osx',
    buttons: {
        "I've read and understand this": function() {
            $(this).dialog("close");
        }
    }
});

HTML

你好，世界！

​

<div id="dialog-message" 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>

实际上，我是在谷歌( 这把小提琴 )上发现的。我注意到小提琴使用的是jQuery 1.5.2，但我没有这个库(我下载它们以便可以脱机编写代码)。这段代码在我的本地浏览器上不起作用，尽管它适用于小提琴。当我将小提琴使用的库更改为jQuery 1.11.0 (这是我在本地笔记本中拥有的库)时，小提琴就失败了。

我在想，如果我有最新的jQuery版本，那就足以支持这些新特性了吗？还是我需要单独下载这个库？

当我查看控制台的错误时，没有错误。所以这事就别挡道了。

这里有什么问题？

Answer 1

尝试将jQuery和jQueryUI包含一次，而不是像现在这样做两次：

<script type="text/javascript" src="scripts/jquery-1.10.2.js"></script>
<script type="text/javascript" src="scripts/jquery.cookie.js"></script>
<script type="text/javascript" src="scripts/jquery-ui-1.10.4.custom.min.js"></script>

并将代码包装到DOM就绪处理程序中：

$(function() {
     // Your jQuery code here
});