Javascript 在外部单击IOS设备时关闭Slicknav菜单
我正在使用Slicknav移动菜单脚本: 它工作得很好,只是我不知道如何在ios设备上点击菜单外的时候关闭它。当我在台式机和安卓系统上测试它时,它在点击外部时关闭良好,但在我的Ipad上它不工作。这是当前的代码。有什么见解吗?谢谢大家!Javascript 在外部单击IOS设备时关闭Slicknav菜单,javascript,jquery,mobile,menu,focusout,Javascript,Jquery,Mobile,Menu,Focusout,我正在使用Slicknav移动菜单脚本: 它工作得很好,只是我不知道如何在ios设备上点击菜单外的时候关闭它。当我在台式机和安卓系统上测试它时,它在点击外部时关闭良好,但在我的Ipad上它不工作。这是当前的代码。有什么见解吗?谢谢大家! <script src="slicknav.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('.menu').slic
<script src="slicknav.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.menu').slicknav({
label:'',
closeOnClick:true
});
$('.slicknav_menu').focusout(function(event){
$('.menu').slicknav('close');
});
});
</script>
<nav>
<ul class="menu">
<li><a href="">Home</a></li>
<li><a href="">Link1</a></li>
<li><a href="">Link2</a></li>
</ul>
</nav>
$(文档).ready(函数(){
$('.menu').slicknav({
标签:“”,
closeOnClick:对
});
$('.slicknav_菜单').focusout(函数(事件){
$('.menu').slicknav('close');
});
});
我记得我创建了第一个移动网站,这个问题浪费了我很多时间。iOS存在已知的问题:单击时悬停状态
仔细阅读-它会解决你的问题 在我的网站上,右菜单使用slicknav。多亏了这段代码,当我在iOS上点击外部时,它会很好地关闭。演示:
替换此项:
$('.slicknav_menu').focusout(function(event){
$('.menu').slicknav('close');
});
为此:
$("div, html").on("click", function (event) {
if(!$(event.target).hasClass(".menu a") &&
!$(event.target).hasClass("ul.slicknav_nav li a") &&
!$(event.target).hasClass("slicknav_menutxt") &&
!$(event.target).hasClass("slicknav_icon") &&
!$(event.target).hasClass("slicknav_icon-bar") &&
!$(event.target).hasClass("slicknav_btn")) {
$(".menu").slicknav('close');
}
});
我用过这样的东西
$(window).on("touchstart", function(e) {
var container = $("#menu");
if (!container.is(e.target) // if the target of the click isn't the container...
&& container.has(e.target).length === 0) // ... nor a descendant of the container
{
$('#menu').slicknav('close');
}
});
所以我假设closeOnClick选项并没有剪切它,而您尝试剪切后的代码片段<代码>$('.slicknav_menu').focusout(函数(事件){$('.menu').slicknav('close');});})代码>此外,这可能是一个浏览器问题,与Ipad或Android无关。你在Ipad上使用的浏览器是什么?