对于某些HTML内容，点击事件在Safari浏览器中不起作用 [英] Click event doesnt work in safari mobile for some HTML content

问题描述

在我的Web应用程序中，有一个单独的导航栏用于移动设备.我希望单击菜单按钮或单击站点中的其他任何位置时，此导航栏都折叠.它已经可以在任何移动浏览器中使用，但不能在safari mobile中使用(在safari中，对于主页它也可以使用，但不能在其他页面上使用).在其他页面中，有一些动态生成的html.看来click事件不适用于这些内容.我真的很感激此问题的解决方案.代码如下.我试过'body'，$(document)，window而不是$('html').也不适合他们.

In my web app, there is a separate navbar for mobile devices. I want this navbar to collapse when the menu button is clicked or anywhere else in the site is clicked. It already works in any mobile browser but not it safari mobile (In safari also, for home page it works but not in other pages). In other pages, there are some html generated dynamically. It seems that the click event doesn't work for those content. I'd really appreciate a solution for this problem. the code is as follows. I've tried 'body', $(document), window instead of $('html'). It doesn't for them also.

$('html').click(function(event) {
            var clickover = $(event.target);
var $navbar = $(".navbar-collapse");               
var _opened = $navbar.hasClass("in");
if (_opened === true && !clickover.hasClass("navbar-toggle")) {      
    $navbar.collapse('hide');
}
        });

我还尝试了为iPad修复jQuery单击事件.但是其中提到的代码根本不会触发.我为此尝试过的代码如下.

I've also tried what is mentioned in Fixing jQuery Click Events for the iPad. But the code mentioned in there doesn't trigger at all. The code I've tried for this as belows.

var ua = navigator.userAgent,
event = (ua.match(/iPad/i)) ? "touchstart" : "click";

$('body').bind(event, function(e) {
            var clickover = $(event.target);
var $navbar = $(".navbar-collapse");               
var _opened = $navbar.hasClass("in");
if (_opened === true && !clickover.hasClass("navbar-toggle")) {      
    $navbar.collapse('hide');
}

}

我非常感谢您为我的问题提供答案(我已经为此工作了一天多，但没有找到解决方案).

I'd really appreciate an answer for my question (I was working on this for more than a day but didn't find a solution).

推荐答案

无论如何，我终于找到了解决方案.原因是，iPhone Safari不支持事件委托.我最初的要求是在单击HTML正文时触发click事件.无论如何，问题仅发生在Safari移动版上，而我发现的原因是，Safari不支持click事件的事件委托.我通过在正文CSS中添加以下代码解决了该问题.

Anyway I finally found a solution. The reason was, iPhone Safari doesnt support event delegation. What my initial requirement was to trigger the click event when the body of the HTML is clicked. Anyway the issue was only occurring on Safari mobile and the reason I found was, Safari doesn't support event delegation for the click event. I solved it by adding below code in the body CSS.

cursor: pointer;

我得到答案的资源是， iPhone上的点击事件委派

Thre resources I got the answer were, Click event delegation on the iPhone

和

在iOS中不起作用的jQuery单击事件:答案

多哈卜，也谢谢你的回答.

And Dohab, Thank you for your answer too.

这篇关于对于某些HTML内容，点击事件在Safari浏览器中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！