大家好,这似乎是有史以来最愚蠢的问题,但帮助我解决这个问题的网站正在维护中。我正处于学习 jquery mobile 的早期阶段,需要一些帮助。
我在 html5 页面中有一个非动态的有序 ListView 。我想在手机上显示一个警报(就像 ios 上的弹出警报),向用户显示文本,然后他们可以单击“确定”关闭它以返回到有序 ListView 。我的html是这样的。我希望当我单击此列表中的 Montview 作为示例时,iPhone 上会弹出一个警报,其中包含一些供用户使用的文本,然后他们单击“确定”将其关闭。
有人可以帮我解决所需的 jquery mobile javascript 问题吗?就像我说的,我正在学习,但后来网站就瘫痪了。
谢谢
<head>
<title>title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="lib/jquery-1.6.4.js"></script>
<script src="lib/jquery.mobile-1.1.0.js"></script>
<script type="text/javascript" src="https://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
<link href="src/css/jquery.mobile.structure-1.1.0.css" rel="stylesheet">
<link href="src/css/jquery.mobile.theme-1.1.0.css" rel="stylesheet">
</head>
<body>
<div data-role="page" id="page1">
<div data-role="header">
<h1>Grounds</h1>
</div>
<div data-role="content">
<ol data-role="listview" data-theme="c" data-inset="true">
<li>
<a>Montview</a>
</li>
<li data-theme="b">
<a>Asquith</a>
</li>
<li>
<a>Button</a>
</li>
<li>
<a>Button</a>
</li>
</ol>
</div>
</div>
<div data-role="page" id="page2">
<div data-role="header">
<h1>Header</h1>
</div>
<div data-role="content"></div>
<div data-role="footer">
<h1>Footer</h1>
</div>
</div>
</body>
最佳答案
很抱歉,如果我误解了这个问题,但是您是否正在寻找类似的东西?
// this will bind all of the items
$(function(){
$("ol[data-role='listview']").click(function(){
alert("woah!");
});
});
编辑: 如果你想为每个列表项绑定(bind)一个不同的事件,你需要给这些项目一个 id(或者用来区分它们的东西,你也可以选择每个 - 浏览它们的内容并以这种方式区分它们,但是我建议不要这种方法)。
<ol data-role="listview" data-theme="c" data-inset="true">
<li id="mountView">
<a>Montview</a>
</li>
<li id="asquith" data-theme="b">
<a>Asquith</a>
</li>
<li id="someButton">
<a>Button</a>
</li>
<li>
<a>Button</a>
</li>
</ol>
然后在你的 JavaScript 中:
$(function(){
$("li#mountView").click(function(){
alert("Mount View Event!!!");
});
$("li#asquith").click(function(){
alert("Asquith Event!!!");
});
});
编辑2
仔细检查您的 html 后,我注意到您添加了另一个“页面”部分。
我怀疑您想通过单击其中一个链接来打开此页面的内容。
检查这个JSFIDDLE你就会明白我的意思。 (此解决方案甚至不需要代码,只要您正确注释了元素,jquery mobile 就会自动连接您的事件)。注意这部分 -> <a href="#page2" data-rel="dialog">bar</a>
关于jquery - 如何在选择listview jquery后显示警报,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14866486/