2010-12-16 67 views
0

我正在构建一个针对iPhone的web应用程序。大多数情况下,我不希望用户能够选择屏幕上的文本(即按钮文本,工具栏等),所以在我的CSS中,我指定了-webkit-user-select的默认行为:无;。但在某些表格单元格中,我确实希望用户能够选择文本,因此我将以下.clect类应用于将-webkit-user-select更改为auto的.selectable。现在这可以在Chrome和Safari中使用,但不能在iPhone上使用。有人可以解释为什么和/或如何解决它?无法选择表格单元格中的文本(iPhone Mobile Safari)

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-用户选择:完全没有,而它确实让我选择其他的东西,它不会让我选择一个表格单元格的文字,只有作为一个整体。无论如何要让它按原样工作,或者我需要完全移除表格吗?

回答

1

请注意,表格单元格的文本仅适用于选择,如果缩放级别足够高以供用户拉动单元格内的选择手柄而不触发其他元素的选择。这是不容回避的,并发生在所有页面上。

+0

这个def似乎是我的问题。任何避免触发选择其他元素的策略? – ashansky 2010-12-16 20:44:39

+0

除了在元素周围提供足够的空间,或者使用文本区域之外,没有。 – millenomi 2010-12-22 13:33:43

0

你不应该阻止 - 一切 - 以后才允许某些部分。相反,你应该只阻止你不想被选择的元素。这将解决您的问题。 :-)