当文本包含在距页面顶部有偏移(填充、边距)的 iFrame 中时，iOS 设备上的移动选择似乎无法正常工作。
在下面的示例中，如果打开页面:https://viking2917.github.io/mobileselectionbug/ 在 iOS 移动浏览器上，他们点击并按住第一行中的“amet”一词以将其选中，然后尝试通过拖动文本选择拖动 handle 来扩大选择范围，拖动 handle 将立即跳到附近页面底部，如果你四处拖动它，你会看到拖动 handle 偏离你的手指(看起来像 iFrame 偏离页面顶部的量)。
重现此内容的 HTML(托管在上面的链接中):
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, user-scalable=no">
</head>
<body>
<div>
<div>
<div style="height: 200px;"></div>
<iframe srcdoc="<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam dignissim neque nec ante suscipit semper. Sed sit amet rutrum metus, in mattis ante. Quisque at nunc tellus. Maecenas ut rhoncus erat, sit amet ultricies augue. Aliquam et consectetur mauris. Pellentesque porttitor accumsan pretium. Vivamus risus lorem, varius in laoreet vel, interdum nec metus. Nam gravida vehicula lorem at lobortis. Curabitur sit amet libero ut nulla fermentum volutpat sed at mauris. Ut mollis at tellus vel tincidunt. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Integer lacinia iaculis odio, sed tincidunt massa accumsan a. Aliquam arcu urna, ullamcorper sagittis nunc eu, facilisis tempor felis. Ut fermentum justo in risus ullamcorper, tempus viverra neque venenatis. Aenean lectus sapien, interdum ut congue non, hendrerit sed diam. Suspendisse ante tellus, luctus eget ex eu, faucibus porttitor nulla.</p><p> Aliquam iaculis placerat tincidunt. Donec justo ligula, dictum ac volutpat accumsan, molestie eu est. Pellentesque lectus est, elementum sed finibus non, scelerisque a nunc. Cras id ornare turpis. Quisque consequat erat turpis. Vestibulum ut nulla feugiat, pretium eros et, dignissim nisi. Sed et finibus turpis. Morbi viverra vulputate lacus.</p><p>Sed in lorem laoreet, gravida metus nec, cursus nunc. Proin dignissim elit id urna imperdiet commodo. Nullam laoreet elementum risus vel tristique. Praesent aliquam ante id nibh condimentum, in semper lectus porta. Proin commodo leo sit amet finibus consectetur. Nam posuere lorem elit, at eleifend odio lobortis nec. Aenean ultricies tellus nec nunc porta, id hendrerit dui malesuada. Aliquam vel lacus feugiat tellus fermentum sollicitudin. Suspendisse consectetur ipsum ac ligula tincidunt molestie. Aenean vel ex eget justo pretium sodales eu sed lectus. Quisque malesuada rutrum tincidunt. Cras sit amet massa pulvinar, fermentum ante in, tristique diam. Etiam nec semper mauris. Donec ultricies purus ut est scelerisque eleifend imperdiet accumsan mi.</p>">
</iframe>
</div>
</div>
</body>
</html>
我看不出我做错了什么，有什么想法吗？
真的感觉像是一个浏览器错误。这在移动版 Chrome、Safari 和 Firefox 上是错误的。
最佳答案
这是一个 iOS/Safari 错误。该修复程序处于 12.2 的测试版中，将在某个时候发布。详情在这里:https://bugs.webkit.org/show_bug.cgi?id=193663
关于html - 无法在 iOS 设备上使用 iFrame 选择文本 (webkit)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54300608/