在javascript

Question

我的javascript非常基本，所以我会问专家我当前的方法是否正确，以及是否有更好的，更可接受的方法。

通常我会使用jquery的.on事件来触发一个函数，如下所示：

$("body").on("input", "textarea", textareaAutoGrow);

function textareaAutoGrow() {
    var pad = $(this).outerHeight(false) - $(this).innerHeight();

    this.style.height = "auto";
    this.style.height = (this.scrollHeight + pad) + "px";
}

这样，'this'会自动传递，但是我现在需要在所有textareas的窗口调整大小事件上做同样的事情，而不仅仅是一个特定的事件。

以下是我的表现：

$(window).on("resize", refreshAutoGrow);

function refreshAutoGrow() {
        $el = $(".text-field.autogrow").filter(function () {
            return $(this).val();
        });

        $el.each(function () {
            textareaAutoGrow.call(this);
        });
    }

我使用.call调用了textareaAutoGrow函数 - 这是我从查看jquery小部件时获取的内容。

它有效，但正如我所说，这是一个非常猜测 - 这是正确的方法，还是有更多可接受的方式来做我想做的事情？

Answer 1

在调整大小时使用each触发它以循环textareas：

function textareaAutoGrow() {
    var pad = $(this).outerHeight(false) - $(this).innerHeight();

    this.style.height = "auto";
    this.style.height = (this.scrollHeight + pad) + "px";
}

$("body").on("input", "textarea", textareaAutoGrow);
$(window).on("resize", funtion() {
    $("textarea").each(textareaAutoGrow);
});