如果您查看以下站点:rosslote.eu,您将看到一个名为“setup”的菜单项。此菜单项有一个下拉菜单。该下拉菜单在桌面上完美运行,但一旦加载到移动设备上,设置下拉菜单中的链接就会停止工作。他们唯一要做的就是折叠下拉菜单。
这是代码:
<ul class="top-level nav">
<li class="dropdown ">
<a href="#" class="dropdown-toggle " data-toggle="dropdown">setup<b class="caret"></b></a>
<ul class="level-1 dropdown-menu">
<li><a href="/#/">database</a></li>
<li><a href="/#/">info</a></li>
<li><a href="/#/">images</a></li>
<li><a href="/opening-times/">opening times</a></li>
<li><a href="/google/">google</a></li>
<li><a href="/meta/">meta</a></li>
<li><a href="/article-editor/">main article</a></li>
</ul>
</li>
<li><a href="/plugins/">plugins</a></li>
</ul>
我在页面底部尝试了以下脚本:
<script>
$('.dropdown-menu a').on('click', function(event){
event.stopPropagation();
});
$('.dropdown-menu li').on('click', function(event){
event.stopPropagation();
});
</script>
同样,这在我的桌面上实现了预期的结果,但在移动设备上却没有。