按钮 onClick 在移动设备上不起作用答案

【问题标题】：Button onClick not working on mobile device按钮 onClick 在移动设备上不起作用
【发布时间】：2016-08-12 16:07:12
【问题描述】：

我尝试了很多来自：
onClick not working on mobile (touch)

document .click function for touch device

但是似乎没有任何效果。

这是我所拥有的：

#modal-close {cursor:pointer;}

<button class="button" id="modal-close">ok</button>

function hideModal(){
    var modal = document.getElementById('modal');
    modal.style.display = 'none';
}

 $(function() {
        $('#modal-close').on('click touchstart',function (e) {
            hideModal();
            })
        });

我可能做错了什么？

【问题讨论】：

使用这个'$('#modal-close').on('click touchstart',function () { hideModal(); })'
我在 ios 上看到过这个问题。 touch 触发悬停状态而不是触发点击事件。我相信我们用它来解决问题：github.com/ftlabs/fastclick
@RashidJaved 不起作用
@RobertBroden 您只是简单地包含它还是涉及任何其他代码？
@blue_zinc 另一个开发者包含了它。它似乎有一个用法部分来解释如何实现它

标签： javascript jquery mobile touch

【解决方案1】：

将按钮的 id 更改为 modal_close。这可能对你有用。 id 值就像一个标识符，所以我们不能使用每个符号来命名标识符。

【讨论】：

【解决方案2】：

结果

 #modal-close {cursor:pointer;}

<button class="button" id="modal-close">ok</button>

function hideModal(){
    var modal = document.getElementById('modal');
    modal.style.display = 'none';
}

 $(function() {
        $('#modal-close').on('click touchstart',function (e) {
            hideModal();
            })
        });

有效

让我印象深刻的是hideModal()，它使用classList 添加或删除类。我将它切换到className +=，它按预期工作。

【讨论】：