Question

我正在尝试在Vuejs应用程序中的html / css / javascript中模拟终端。为此，我正在使用文本区域。

用户不应单击上一行并更新或删除文本。这样可以防止用户单击文本区域而仅允许键盘操作吗？

Answer 1

您可以只阻止文本区域上的默认onmousedown事件：

document.getElementById('textarea').onmousedown = function(e){
  e.preventDefault();
}

Answer 2

您可以简单地使用仅css解决方案：

<textarea unselectable="on" id="my_textarea"></textarea>

*.unselectable {
   -webkit-user-select: none;
}

Answer 3

将disabled属性添加到<textarea>标记中，如下所示：

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

Answer 4

是的，有可能您可以禁用文本区域，并且还可以将其设置为只读状态

已禁用的文本区域

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>This is textarea with disabled</h1>

<textarea rows="10" cols="50" disabled>
	dsdkiensdsndsjdnjnjdndjsndajndasjdnasjd
</textarea>

</body>
</html>

具有只读字符的文本区域

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>This is Textarea with readonly</h1>


<textarea rows="10" cols="50" readonly>
	dsdkiensdsndsjdnjnjdndjsndajndasjdnasjd
</textarea>

</body>
</html>

Answer 5

您可以在HTML标记中使用readonly属性。

工作示例：

<textarea readonly>
Here is some sample text.
</textarea>

有没有一种方法可以防止用户在文本区域中单击？

5 个答案: