我可以阻止 Chrome 的 <textarea> 拖动展开功能吗？答案

【问题标题】：Can I block Chrome’s <textarea> drag-to-expand feature?我可以阻止 Chrome 的 <textarea> 拖动展开功能吗？
【发布时间】：2011-02-07 18:54:21
【问题描述】：

在 Chrome 中，<textarea> 字段的右下角可以拉出以扩大文本区域。这有时有其优点，但有时却没有。（这个讨论是另一个时间。）

如果可能的话，我想知道如何阻止这种行为。我在想一些类似于 JS/jQuery dingus 的东西，但我真的不知道 Google 是如何编写该功能的。

有人玩过这个吗？

【问题讨论】：

【解决方案1】：

您是否尝试过使用 CSS 来阻止这种情况？

textarea {
  resize: none;
}

这应该禁用拖动展开功能。

更新

您也可以使用 jQuery 以编程方式设置：

// CSS
textarea.no-expand {
  resize: none;
}

// jQuery
$('#my-text-area').addClass('no-expand');

希望这会有所帮助！

【讨论】：

我不知道resize。看起来它应该可以完成这项工作。谢谢大家。
你也可以#my-text-area { resize: none; }。一般来说，当您可以仅使用 CSS 轻松实现相同的事情时，我认为没有必要引入 JavaScript。
@nelson 我只是想我会提到 jQuery 替代方案，以防他想以编程方式控制拖放扩展功能。
我误解了你的意思。得分。

【解决方案2】：

聚会有点晚了，但这里开始了。 resize: none 解决方案的问题在于它不是有效的 CSS。这不仅不会验证，而且不会在其他浏览器上运行，并且可能会在未来的 Chrome 版本中中断。一个不同的有效解决方案是：

textarea {
    width: 100px;
    height: 100px;
    max-width: 100px;
    max-height: 100px;
}

当然，您应该相应地调整您的尺寸。当然，这没有resize: none 的灵活性（您不能只将一种样式应用于页面上的所有textareas），因此，在这方面，resize: none 会更好。但是，如果您可以使用此解决方案，您应该这样做。

【讨论】：

【解决方案3】：

可能最简单的方法是将“resize: none”指定为样式的一部分：

textarea {
    resize: none
}

【讨论】：