javascript - 禁用文本区域中的文本选择

Question

我需要找到一种方法来防止用户在文本区域中选择文本。目标是创建一个自定义键盘，用于在文本区域中输入文本。我希望用户能够单击文本区域来设置插入符位置(现在已经可以使用)。但是，我不希望用户能够选择插入文本的某些部分，或者至少应该没有视觉指示。我已经尝试了一些东西，比如下面的 CSS，但没有成功。

textarea {
    -moz-user-select: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    user-select: none;
}

解决方案可以使用 CSS 和/或 JavaScript，并且只需要在 Google Chrome 中运行。

---

禁用文本区域对我不起作用。正如我所提到的，我希望用户能够通过单击位置将插入符号放置在特定位置。如果我禁用文本区域，则此功能将丢失。

Answer 1

“只读”属性和“用户选择”属性的组合起作用。

第二条规则在选择时禁用高亮边框，这是一种视觉选择。

“不可选择”属性似乎是 Opera/IE 特定的。

样式:

.noselect {
   cursor: default;
   -webkit-user-select: none;
   -webkit-touch-callout: none;
   -khtml-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   -o-user-select: none;
}

.noselect:focus {
   outline: none;
}

标记:

<textarea class="noselect" readonly="readonly" unselectable="on"></textarea>

只读可能比禁用更合适(在单击事件时仍然可以使用 JS 切换)。