无法选择表格单元格中的文本 (iPhone Mobile Safari)
我正在构建一个针对 iPhone 的网络应用程序。大多数情况下，我不希望用户能够选择屏幕上的文本（即按钮文本、工具栏等），因此在我的 css 中，我指定了 -webkit-user-select 的默认行为：none ;.但在某些表格单元格上，我确实希望用户能够选择文本，因此我应用 .selectable 下面的 css 类，它将 -webkit-user-select: 更改为 auto。现在，这可以在 Chrome 和 Safari 中使用，但不能在 iPhone 上使用。有人可以解释为什么和/或如何解决它吗？
body {
/* Remove the iphone callout */
-webkit-touch-callout: none;
/* Remove the iphone link highlight */
-webkit-tap-highlight-color: rgba(0,0,0,0);
/* Prevent the automatic resizing of text */
-webkit-text-size-adjust: none;
/* Limit copy and paste to only elements we want */
-webkit-user-select: none;
overflow-x: hidden;
font-family: Arial, Helvetica, sans-serif;
font-size:13px;
margin:0;
padding:0;
min-height:460px;
}
.selectable, input, textarea {
-webkit-user-select: auto;
}
编辑：我尝试完全删除 -webkit-user-select:none ，虽然它确实允许我选择其他内容，但它不允许我选择表格单元格的文本，只能选择整个行。无论如何，有没有办法让它按原样工作，或者我是否需要完全删除该表？
I'm building a webapp that targets the iPhone. And for the most part I don't want a user to be able to select the text on the screen (ie button text, toolbars, etc), so in my css I specify the default behavior for -webkit-user-select: none;. But on certain table cells I do want the user to be able to select text, so I apply the css class below .selectable which changes the -webkit-user-select: to auto. Now this works in Chrome and Safari, but not on the iPhone. Could someone explain why and/or how to fix it?
body {
/* Remove the iphone callout */
-webkit-touch-callout: none;
/* Remove the iphone link highlight */
-webkit-tap-highlight-color: rgba(0,0,0,0);
/* Prevent the automatic resizing of text */
-webkit-text-size-adjust: none;
/* Limit copy and paste to only elements we want */
-webkit-user-select: none;
overflow-x: hidden;
font-family: Arial, Helvetica, sans-serif;
font-size:13px;
margin:0;
padding:0;
min-height:460px;
}
.selectable, input, textarea {
-webkit-user-select: auto;
}
Edit: I tried removing the -webkit-user-select:none altogether, and while it does allow me to select other things, it does not allow me to select the text of a table cell, only the row as a whole. Is there anyway to get this to work as is or do I need to remove the table altogether?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
请注意，只有当缩放级别足够高，用户可以在单元格内拉动选择手柄而不触发其他元素的选择时，表格单元格的文本才可供选择。这种情况很难避免，并且会发生在所有页面上。
Note that the text of the table cell is only available for selection if the zoom level is high enough for the user to pull the selection handle inside a cell without triggering the selection of other elements. This is nontrivial to avoid, and happens on all pages.
你不应该阻止一切——只是为了稍后允许某些部分。相反，您应该仅阻止您不想选择的元素。这将解决您的问题。 :-)
You should not be blocking --everything-- only to allow some parts later. Instead, you should block only the elements you don't want to be selectable. This will solve your issue. :-)