Question

我想在用户更改尺寸时保存textarea的高度和宽度。

我尝试使用：

$('textarea').resize(function() {

    var height = $('textarea').css('height');

    var width = $('textarea').css('width');

    $.post('vocabresize.php?height=' + height + '&&width=' + width, function() {});

});

但是尚未调用$ .post（）函数，因此我将其更改为：

$('textarea').resize(function() {

    $('body').html('Yay it worked');

});

当我更改textarea的大小时，“没问题”没有出现。

Answer 1

调整大小后，

textarea不会触发resize事件；那是为了调整窗口的大小。相反，您可以在函数外部存储文本区域的大小，然后在释放鼠标时检查更改。这样的东西会起作用：

let myTextArea = $('#myTextArea');
let oldHeight = myTextArea.height();
let oldWidth = myTextArea.width();

myTextArea.mouseup(function() {
    let newHeight = $(this).height();
    let newWidth = $(this).width();
    if(newHeight !== oldHeight || newWidth !== oldWidth) {
        console.log("Text area was resized!");
        oldHeight = newHeight;
        oldWidth = newWidth;
    }
})

请注意，由于其他原因，textarea的大小不会更改；例如，当窗口调整大小时。另外，要使其适用于页面上的每个文本区域，您都需要遍历它们，并将其尺寸存储在一个对象中，以便检索它们。

Answer 2

.resize在textarea元素上不起作用。我刚刚亲自测试过。您可以这样做；）

var textareaWidth;
var textareaHeight;
$('textarea').mouseup(function(evt) {
    if(this.clientWidth != textareaWidth || this.clientHeight != textareaHeight) {
        console.log(`new size= ${this.clientWidth} x ${this.clientHeight}`);
        textareaWidth = this.clientWidth;
        textareaHeight = this.clientHeight;
    }
});

文本区域的.resize（）函数

2 个答案: