Ada*_*ood 9 javascript iphone jquery mobile-safari ios
背景:我有一个下拉菜单,其基本上与此其他Mobile Safari事件问题中描述的相同:单击菜单项以显示下拉列表,或者再次单击菜单项或单击页面上的任何其他位置以隐藏菜单.隐藏下拉列表的jQuery绑定到<div>跨越整个窗口的父级的click事件.这个下拉列表在所有浏览器中都可以正常运行,包括Mobile Safari,我只是为了上下文而在这里描述它.
问题:此onclick事件阻止Mobile Safari上的用户(在iPod Touch 4.2.1和iPad 4.3.5上测试)获得正常的触摸保持复制| 在我们的网站上粘贴弹出窗口.D'哦!根据我的研究,似乎如果HTML元素定义了一个点击处理程序,其包含的内容将不可复制？
我在这里设置了一个简化的演示(更新:我在这个演示中使用直接JavaScript来说明它不是jQuery问题,但是这也无法与jQuery的.click()一起使用):http:/ /adamnorwood.com/ios-copypaste.html
如果您在Mobile Safari中打开该链接,则无法复制lorem ipsum文本,但是当您单击文本以证明单击处理程序正在触发时,您将通过console.log()收到消息.
如果链接断开,这是它的要点:
<div id="content">Imagine a large block of text here...</div>
<script>
document.getElementById('content').onclick = function() {
console.log('You just clicked me!');
}
</script>
我试过的事情:
-webkit-user-select: text如此处所述
使用onmouseup和其他事件而不是onclick(nope).
将onclick移动到<body>标签或窗口对象
iOS处理事件文档中的图6-4 是相关的,但没有引导我对如何做的任何重大启示......
有什么想法吗？这是它应该工作的方式,还是我错过了什么？有没有办法让这个文本可选,但仍然激活点击处理程序？或者也许我应该回到绘图板,了解如何最好地隐藏下拉菜单,以便我完全避免这个问题？
啊哈，在将这个问题搁置了几周后，突然想到了一个解决方案（至少乍一看似乎可行）。Mobile Safari 可以更好地利用事件处理程序，而不是使用.onclick()（或 jQuery ）来实现此目的：.click()touchstart
<div id="content">Imagine a large block of text here...</div>
<script>
document.addEventListener('touchstart', function () {
console.log('Yay, you clicked the text, and you can still copy-and-paste!');
}, false);
</script>
使用此代码后，我的示例案例中的下拉菜单可以通过单击文档上的其他任何位置来隐藏，并且我仍然可以访问标准的 iOS Copy | 按住文本时粘贴气泡（所需的正常行为）。Mobile Safari 获取“touchstart”侦听器，其他浏览器获取“onclick”。我不喜欢必须放置这种浏览器嗅探，但它解决了问题。除非有理由将其作为 touchstart 事件进行侦听是一个问题，否则我会将其标记为已回答。
| 归档时间： |
|
| 查看次数： |
4887 次 |
| 最近记录： |