css - 可能有一个初始宽度的 textarea 但保持可调？

Question

我有一个 float 文本区域，用户可以在其中将其调整为他们想要的任何宽度和高度。单击提交按钮后，我使用 jQuery 获取当用户调整文本区域大小时拉入样式属性的样式(宽度、高度和边距)。然后将其传输到发布值的隐藏输入 - 这样当页面在提交后加载时，有一个变量可以放回文本区域样式($_POST['styles'])。这很好用，除了文本区域由于某种原因不能调整到更小的宽度。它可以做得更大，但不能小于最初放置在文本区域样式中的宽度。高度在这方面效果很好。因此，如果用户将宽度调整为整个页面的宽度，然后点击提交，他们就会被 100% 页面宽度的文本区域卡住。

我尝试了另一个删除宽度的 jQuery 语句，但将其缩小到默认的最小尺寸。 “宽度:自动”也是如此。我希望，因为宽度是在使用 PHP 加载页面时放置在文本区域中的，所以之后它不会“一成不变”。但它是。是否还有其他选项可以创建文本区域的初始宽度，但仍可调整？

Answer 1

使用 jQuery UI resizable()
您可以在其中调用调整大小事件来设置隐藏字段值。

工作示例 https://jsfiddle.net/icecred/Lco2gkh3/6/

HTML:
<textarea></textarea>

CSS:

textarea {
    height: 250px;
    width: 200px;
}

JS:

$("textarea").resizable({
    resize: function(e) {
        // on resize: set hidden input value
        var height = $(this).css('height');
        var width = $(this).css('width');
        // set hidden input value here
    }
});