jQuery click事件在移动浏览器中似乎并未触发。
HTML如下：
<!-- This is the main menu -->
<ul class="menu">
<li><a href="/home/">HOME</a></li>
<li class="publications">PUBLICATIONS & PROJECTS</li>
<li><a href="/about/">ABOUT</a></li>
<li><a href="/blog/">BLOG</a></li>
<li><a href="/contact/">CONTACT</a></li>
</ul>
<!-- This is the sub-menu that is to be fired on click -->
<div id="filter_wrapper">
<ul id="portfolioFilter">
<li><a href="/nutrition-related/">Nutrition related</a></li>
<li><a href="/essays/">Essays and Nonfiction</a></li>
<li><a href="/commissioned/">Commissioned works</a></li>
<li><a href="/plays/">Plays and performance</a></li>
<li><a href="/new-projects/">New Projects</a></li>
</ul>
</div>
这是用于手机的jQuery脚本：
$(document).ready(function(){
$('.publications').click(function() {
$('#filter_wrapper').show();
});
});
当我单击移动浏览器上的“出版物”列表项目时，不会发生任何事情。
您可以在这里查看网站：http://www.ruthcrocker.com/
不确定是否有jQuery mobile特定的事件。
解决方法
如果您已经(或不介意)使用jQuery Mobile，Raminson有一个很好的答案。如果你想要一个不同的解决方案，为什么不只是修改你的代码如下：
<!-- This is the main menu --> <ul class="menu"> <li><a href="/home/">HOME</a></li> <li><a href="#" class="publications">PUBLICATIONS & PROJECTS</a></li> <li><a href="/about/">ABOUT</a></li> <li><a href="/blog/">BLOG</a></li> <li><a href="/contact/">CONTACT</a></li> </ul>
和你的javascript / jquery代码…返回false停止冒泡。
$(document).ready(function(){
$('.publications').click(function() {
$('#filter_wrapper').show();
return false;
});
});
这应该适用于你想要做的事情。
