【问题标题】:Unable to select text in a table cell (iPhone Mobile Safari)无法选择表格单元格中的文本 (iPhone Mobile Safari)
【发布时间】:2010-12-17 03:19:32
【问题描述】:

我正在构建一个针对 iPhone 的 webapp。在大多数情况下,我不希望用户能够选择屏幕上的文本(即按钮文本、工具栏等),所以在我的 css 中我指定了 -webkit-user-select: none 的默认行为;.但是在某些表格单元格上,我确实希望用户能够选择文本,所以我应用了 .selectable 下面的 css 类,它将 -webkit-user-select: 更改为自动。现在这适用于 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,虽然它允许我选择其他内容,但它不允许我选择表格单元格的文本,只能选择整个行.无论如何要让它按原样工作还是我需要完全删除表格?

【问题讨论】:

    标签: iphone html css web-applications


    【解决方案1】:

    请注意,表格单元格的文本只有在缩放级别足够高以供用户拉动单元格内的选择手柄而不会触发对其他元素的选择时才可供选择。避免这种情况并非易事,并且会发生在所有页面上。

    【讨论】:

    • 这个 def 似乎是我的问题。有什么策略可以避免触发其他元素的选择?
    • 除了在元素周围提供足够的空间,或者使用文本区域,没有。
    【解决方案2】:

    您不应该阻止 --everything-- 只是为了稍后允许某些部分。相反,您应该只阻止您不想选择的元素。这将解决您的问题。 :-)

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2011-09-03
      • 1970-01-01
      • 2011-10-20
      • 2023-03-13
      • 2012-03-27
      • 1970-01-01
      • 1970-01-01
      • 2013-05-02
      相关资源
      最近更新 更多