textarea禁止输入

admin 34 0

要禁止`textarea`的输入,你可以使用HTML和CSS来实现,以下是一个简单的示例:

<!DOCTYPE html>
<html>
<head>
  <style>
    .disabled-textarea {
      background-color: #f0f0f0; /* 可选的背景色,表示该元素已被禁用 */
      color: #808080; /* 可选的文本颜色,表示该元素已被禁用 */
      pointer-events: none; /* 禁止鼠标事件,如点击和悬停 */
    }
  </style>
</head>
<body>

<textarea id="myTextarea" rows="4" cols="50" class="disabled-textarea" readonly></textarea>

<script>
  // 如果你还想通过JavaScript来禁用textarea,你可以这样做:
  // document.getElementById('myTextarea').disabled = true;
  // 但请注意,这将改变textarea的外观,并且用户仍然可以选择和复制其中的文本。
  // 使用CSS的`pointer-events: none;`可以确保textarea看起来像是被禁用了,并且用户不能与之交互。
</script>

</body>
</html>

在上面的示例中,`textarea`元素具有`readonly`属性和一个名为`disabled-textarea`的CSS类,`readonly`属性确保用户不能编辑`textarea`的内容,而`disabled-textarea`类使用CSS来更改其外观,并通过`pointer-events: none;`来禁止鼠标事件。

请注意,尽管`readonly`属性可以防止用户编辑`textarea`的内容,但它不会阻止用户选择或复制其中的文本,如果你希望完全禁止用户与`textarea`交互,包括选择和复制文本,那么你可能需要使用JavaScript或其他技术来实现这一点。