jquery 移动弹出窗口不起作用?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10147371/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery mobile popup not working?
提问by Chanckjh
im using jquery mobile. im trying to create a popup. I found this simpel code that should work. http://jquerymobile.com/branches/popup-widget/docs/pages/popup/index.html
我正在使用 jquery mobile。我正在尝试创建一个弹出窗口。我发现这个简单的代码应该可以工作。http://jquerymobile.com/branches/popup-widget/docs/pages/popup/index.html
I tried the code in the example
我尝试了示例中的代码
<a href="#popupBasic" data-rel="popup">Tooltip</a>
<div data-role="popup" id="popupBasic">
This is a completely basic popup, no options set.
</div>
but when I put this in my own code the div will still display and when I click on the button it goes to an other page, instead of a popup. Can someone help me?
但是当我把它放在我自己的代码中时,div 仍然会显示,当我点击按钮时,它会转到另一个页面,而不是弹出窗口。有人能帮我吗?
采纳答案by user1263226
Well ... I've gotten it to work (sample code below, sorry for the muddled string I couldn't get it to display in the code blocks otherwise) ... but I'm wondering how YOU found this page?? This doesn't seem to be part of the latest jQuery Mobile release candidate ... so my guess is that it's not working for you because your JS and CSS references aren't pointing to the files that actually contain the corresponding code?
嗯......我已经让它工作了(下面的示例代码,抱歉我无法让它在代码块中显示的混乱字符串)......但我想知道你是如何找到这个页面的??这似乎不是最新的 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>
回答by QuickFix
It seems popups are scheduled for 1.2 release (see this page on github). I think the "branches" in the url page indicates that this page is from the unreleased dev branch of jQuery mobile. If you look at the docs page for the 1.1 release, this feature is not documented.
似乎弹出窗口计划在 1.2 版本发布(请参阅github 上的此页面)。我认为 url 页面中的“分支”表示该页面来自 jQuery mobile 未发布的 dev 分支。如果您查看 1.1 版本的文档页面,则没有记录此功能。
It can be added to 1.0 by adding either the jquery.mobile.popup.js and css from the previous github link or use the web-ui-fw projectwhich includes the popup widget and other widgets.
可以通过添加上一个 github 链接中的 jquery.mobile.popup.js 和 css 或使用包含弹出窗口小部件和其他小部件的web-ui-fw 项目将其添加到 1.0 。
I use web-ui-fw to have popups with jQuery mobile 1.1; this plugin uses "popupwindow" instead of "popup" for the data-rel and data-role
我使用 web-ui-fw 在 jQuery mobile 1.1 中弹出窗口;此插件使用“popupwindow”而不是“popup”作为数据相关性和数据角色