9

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

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

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


禁用 textarea 对我不起作用。正如我所提到的,我希望用户能够通过单击位置将插入符号放置在某些位置。如果我禁用 textarea,这个功能就会丢失。

4

7 回答 7

8

“只读”属性和“用户选择”属性的组合有效。

第二条规则禁用选择时突出显示的边框,这是一种视觉选择。

“不可选择”属性似乎是 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 切换)。

于 2014-06-15T20:22:01.360 回答
4
<textarea unselectable="on" id="my_textarea"></textarea>

    *.unselectable {
   -webkit-user-select: none;
    }  
于 2013-10-02T13:59:41.980 回答
1

下面的代码可以帮助你

JS代码:

$(document).ready(function(){
   $('#txtInput').bind("cut copy paste",function(e) {
      e.preventDefault();
   });
});
于 2017-04-26T10:29:18.540 回答
0

或者您可以将 disabled="disabled" 放在 textarea 中,如下所示:

<textarea disabled="disabled"></textarea>

于 2015-01-19T12:23:17.380 回答
0

这些解决方案都不适合我。这是我自己的一个:

textarea::selection {
    background-color: transparent;
}
于 2021-11-11T05:50:45.470 回答
-2

您可以使用 javascript 禁用它:

document.getElementById("textarea").disable='true';
于 2013-10-02T14:00:38.813 回答
-3
<textarea disabled="readonly"></textarea>

测试它工作正常。

于 2013-10-02T14:01:12.290 回答