Javascript jquery ui菜单自定义弹出窗口

我找到了小部件

我希望实现与本演示中所看到的完全相同的行为：

但如果我在页面上添加此代码：

<div class="demo">

<button>Select a city</button>
<ul id="cities">
    <li><a href="#Amsterdam">Amsterdam</a></li>
    <li><a href="#Anaheim">Anaheim</a></li>
    <li><a href="#Cologne">Cologne</a></li>
    <li><a href="#Frankfurt">Frankfurt</a></li>
    <li><a href="#Magdeburg">Magdeburg</a></li>
    <li><a href="#Munich">Munich</a></li>
    <li><a href="#Utrecht">Utrecht</a></li>
    <li><a href="#Zurich">Zurich</a></li>
</ul>

<div id="log"></div>

我得到这个结果：

我看到这个演示使用了一些不同的jQueryUI，但我无法找出确切的区别。你能帮助我如何用纯jqueryui创建与演示中相同的本地弹出窗口吗

---

请不要推荐第三方插件。

该演示是使用jquery ui 1.9创建的，在撰写本文时，它尚未公开发布

---

因此，使用jQueryUI1.8系列无法实现演示中的行为。目前最新的开发版本是1.9m7；可以从

下载。在我看来，您缺少了一些样式。是的，JSFIDLE沙盒缺少一些jquery ui图像，但在我的本地环境中不是这样的，在那里它的行为是相同的。所以我想这没有任何影响。我不认为有什么问题。你有一个工作演示，所以只需复制所有的js和css文件。如果您的JSFIDLE的工作方式不同，那么您可能没有使用与示例相同的代码。您在本地缺少jQuery演示中的CSS/图像，所以请进行整理。jQuery工作得很好，这意味着它肯定是一个样式问题；因此，您的样式是不完整的。完整下载最新的jQuery UI。@JoshuaM：正如所说，我的本地环境包含这些图像，按钮/菜单的行为与JSFIDLE中的相同。JSFIDLE和演示环境并非100%相同，因为JSFIDLE包含标准的jquery+jquery ui。所以问题仍然是，如何使用标准jquery+jquery ui库实现演示中看到的相同结果。

$(function() {
        var btn = $(".demo button").button({
            icons: {
                primary: "ui-icon-home",
                secondary: "ui-icon-triangle-1-s"
            }
        });
        $("#cities").menu({
            select: function(event, ui) {
                $("#log").append("<div>Selected " + ui.item.text() + "</div>");
            },
            trigger : btn});
    });​