单击按钮在iDevices上不起作用

Question

我有这个向下滑动的标题，当它被按下时它就会滑下来。

演示：http://jsfiddle.net/ygAV2/2/

$(document).on("click", 'h1', function() {
    if (!$(this).parent().hasClass('header-down')) {
        $(this).parent().stop().animate({
            height: '100px'
        }, {
            queue: false,
            duration: 600,
            easing: 'linear'
        }).addClass('header-down');
    } else {
        $(this).parent().stop().animate({
            height: '30px'
        }, {
            queue: false,
            duration: 600,
            easing: 'linear'
        }).removeClass('header-down');
    }
});



$(document).click(function () {
    if ($(".box_header").hasClass('header-down')) {
        $(".box_header").stop().animate({
            height: '30px'
        }, {
            queue: false,
            duration: 600,
            easing: 'linear'
        }).removeClass('header-down');
    }
});

$(document).on("click", ".box_header", function (e) {
    e.stopPropagation(); // This is the preferred method.
    // This should not be used unless you do not want
    // any click events registering inside the div
});

标题和“删除我”按钮在电脑上运行正常，但在我的iPhone和iPad上不起作用，以前有人试过吗？

Answer 1

尝试这样做(应该可以，在iOS模拟器上尝试过-没有设备)：

$('h1').on('click touchstart', function() {
    // ... your code 
});

Answer 2

我知道这是一个更老的帖子，但我发现Mac和iOS不允许你点击动作，除非相应的层实际上是一个html按钮。

当我上周建了一个网站时，我注意到了这一点，在Windows和Android设备上，移动菜单可以使用span进行切换，但Mac和iOS不能切换菜单。

当我把图层改成一个真正的html按钮时，它就起作用了！

为这一点向苹果公司道歉！

Answer 3

尝试使用.live()而不是.on或.click

$('h1').live('click', function() {
    // your code goes here...
});