14

我正在使用 jquery mobile。我试图创建一个弹出窗口。我发现这个简单的代码应该可以工作。http://jquerymobile.com/branches/popup-widget/docs/pages/popup/index.html

我尝试了示例中的代码

<a href="#popupBasic" data-rel="popup">Tooltip</a>

<div data-role="popup" id="popupBasic">
    This is a completely basic popup, no options set.
</div>

但是当我把它放在我自己的代码中时，div 仍然会显示，当我点击按钮时，它会转到另一个页面，而不是弹出窗口。有人能帮我吗？

4

2 回答 2

5

嗯......我已经让它工作了（下面的示例代码，很抱歉我无法让它显示在代码块中的混乱字符串）......但我想知道你是如何找到这个页面的？这似乎不是最新的 jQuery Mobile 候选版本的一部分......所以我猜它对你不起作用，因为你的 JS 和 CSS 引用没有指向实际包含相应代码的文件？

<!DOCTYPE html>
<html class="ui-mobile-rendering">
    <head>
        <meta charset="utf-8"/>
        <meta name="viewport" content="width=device-width, initial-scale=1"/>
        <title>JQM popup test</title>
        <link rel="stylesheet"
            href="http://jquerymobile.com/branches/popup-widget/css/themes/default/jquery.mobile.css"/>
        <script src="http://jquerymobile.com/branches/popup-widget/js/jquery.js"></script>
        <script src="http://jquerymobile.com/branches/popup-widget/js/"></script>
    </head>
    <body>
        <a href="#popupBasic" data-rel="popup">Tooltip</a>
        <div data-role="popup" id="popupBasic">This is a completely basic popup, no options set.</div>
        <div>Other</div>
        <div>Random</div>
        <div>Text</div>
    </body>
</html>
于 2012-04-13T21:19:29.713 回答
4

似乎弹出窗口计划在 1.2 版本中发布（请参阅github 上的此页面）。我认为 url 页面中的“分支”表明该页面来自 jQuery mobile 未发布的开发分支。如果您查看 1.1 版本的文档页面，则没有记录此功能。

它可以通过添加之前 github 链接中的 jquery.mobile.popup.js 和 css 或使用包含弹出窗口小部件和其他小部件的web-ui-fw 项目来添加到 1.0。

我使用 web-ui-fw 在 jQuery mobile 1.1 中弹出窗口；该插件对 data-rel 和 data-role 使用“popupwindow”而不是“popup”

于 2012-04-16T08:08:20.030 回答