禁用文本区域的滚动

Question

我正在尝试使文本区域无法滚动，但我无法找到方法使其无法滚动。

我在jsfiddle中制作了一个简单的示例。

Thanks in advance.

- Dennis Offinga

---

可能是 如何禁用textarea的可调整大小属性？ 的重复问题。 - MysterX

Answer 1

试试这个：

<textarea rows="10" cols="45" style="overflow:hidden;resize:none;"  placeholder="Animatie:" name="description" ></textarea>

"

style="overflow:hidden;resize:none;"，这样做应该能够满足你的要求。

"

- Farah Nawaz

Answer 2

只需在 CSS 文件中添加以下内容：

textarea {
    resize: none;
}

或者：

<textarea rows="10" cols="45" placeholder="Animatie:" name="description" style="resize: none"></textarea>

代码演示：https://jsfiddle.net/p6am6dze/2/

- deChristo

---

这只是移除了调整大小的手柄，但不会影响滚动。如果超过底部，jsfiddle示例仍会滚动。 - CpnCrunch

Answer 3

我知道我来晚了，但是如果你只想去掉滚动条但保留调整大小属性，我有一个解决方案。你可以这样做：

textarea::-webkit-scrollbar {
   dipsplay: none;
}

滚动条不会显示。调整大小似乎仍然对我可见，直到文本内容需要滚动。

textarea {
width: 50%;
height: 70px;
resize: vertical;
}
textarea::-webkit-scrollbar {
 display:none;
 }

<p>Add as much text as you want</p>
<textarea></textarea>

注意：你仍然可以滚动，只是不显示滚动条。

- lewism205

Answer 4

如果不需要任何调整大小，请参考Luiz的答案。

如果只需要在一个方向上调整大小，请使用：

textarea { resize: vertical; }

textarea { resize: horizontal; }

- Andrew Sumner

Answer 5

<style>
textarea {
resize: none;
}
</style>

- Arun