jQuery 单击事件在 iOS 中不起作用

标签 jquery ios css click transform

<分区>

Second update: Looks like one of my functions (resetFigures) was preventing the event handler, so moving that to the end of the bind function sorted it out.

Update: I realized after some basic testing that the click events were registering, it's just that the box fails to flip when tapped.

我的网站在 Chrome 和 Firefox 中具有基本的美学功能,但它拒绝在 iOS 上正常运行(在装有 iOS 6.1 的 iPhone 4 和装有 iOS 4.3.5 的 iPad 上测试)。

您可以在此处查看站点,当然还有脚本 (main.js):http://bos.rggwebdesigns.com/

我读到 iOS 并没有真正正确地处理 jQuery 点击事件,但我正在努力找出解决办法。 Stack Overflow 上的几个线程提到了 live() 方法,但像下面这样实现它(以及将 onclick="" 添加到可点击元素)似乎不起作用:

$('.card').live('click touchstart', function() {
        var figure = $(this).children('.back');
        var button = figure.find('.button');
        var column = $(this).parents().eq(1);
        $('.column').removeAttr('style');
        column.css('z-index', 2000);
        resetFigures();
        if(flipCard(this)){
            swoosh.pause();
            swoosh.currentTime = 0;
            swoosh.play();
        }
    });

我还遇到了这个有趣的变通元素:http://aanandprasad.com/articles/jquery-tappable/ . 但是,我也没有运气:

$('.card').tappable(function() {
        var figure = $(this).children('.back');
        var button = figure.find('.button');
        var column = $(this).parents().eq(1);
        $('.column').removeAttr('style');
        column.css('z-index', 2000);
        resetFigures();
        if(flipCard(this)){
            swoosh.pause();
            swoosh.currentTime = 0;
            swoosh.play();
        }
    });

此外,如果我被误导了,请纠正我,但根据这个网站,iOS 支持 3D 转换,并带有适当的前缀:http://caniuse.com/transforms3d

最佳答案

iOS 不注册绑定(bind)到 DOM 加载后添加的元素的点击/触摸事件存在问题。

虽然 PPK 有这个建议:http://www.quirksmode.org/blog/archives/2010/09/click_event_del.html

我发现这个很容易修复,只需将其添加到 css 中即可:

cursor: pointer;

关于jQuery 单击事件在 iOS 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14795944/

相关文章:

javascript - 仅当循环遍历数组时才执行 else 语句

javascript - 如何固定水平和垂直标题但数据应该移动

javascript - 检查所选元素是否包含属性

ios - 显示 URL 中的文件文档

iPhone - 如何阻止 UIWebView 绘制/更新其内容

javascript - 在悬停期间更改 Div 的边框

javascript - 如何在 jquery 中使两个计数器按钮相互独立?

c# - UI 空闲时 iOS 后台线程变慢

html - CSS:使图像流出父容器

javascript - 从祖 parent 获取子元素偏移位置