1

我有一个非常好的小功能，如果它们开始溢出，当它们显示在屏幕上时，它会减小一些 div 内的文本大小。

$(function(){
    $('div.Body').each(function (index) {
        if ($('div.Body')[index].scrollHeight > 150) {
            $('div.Body')[index].style.fontSize = 'small';
            if ($('div.Body')[index].scrollHeight > 150) {
                $('div.Body')[index].style.fontSize = 'x-small';
                if ($('div.Body')[index].scrollHeight > 150) {
                    $('div.Body')[index].style.fontSize = 'xx-small';
                }
            }
        }
    });
})

当用户在提交文本时将文本输入到 textArea 时，我想使用相同/相似的功能来做同样的事情，但是 textArea 似乎没有用于 scrollHeight 的功能：

$(function() {
    window.status = $('.TextAreaClass').scrollHeight;
});

这个函数只是返回未定义。

如何在 textArea 中完成此操作？

4

2 回答 2

1

只需使用this, 而不是$('div.Body')[index]为循环的每次迭代获取：

$('div.Body').each(function () { // Remove the redundant parameter
    if (this.scrollHeight > 150) {
        this.style.fontSize = 'small';
        if (this.scrollHeight > 150) {
            this.style.fontSize = 'x-small';
            if (this.scrollHeight > 150) {
                this.style.fontSize = 'xx-small';
            }
        }
    }
});

中.each，this指$('div.Body')[index]。

而且，就像 Rory 所说，$('.TextAreaClass')返回一个 jQuery 对象。您可能希望使用它$('.TextAreaClass')[0];来访问该对象中的第一个 DOM 元素。

于 2013-01-07T10:18:18.367 回答
0

scrollHeight是一种本机 javascript 方法，而不是 jQuery 方法，因此您需要执行以下操作来scrollHeight获取textarea：

window.status = $('.TextAreaClass')[0].scrollHeight;

注意[0]which 返回 jQuery 对象中的第一个元素，它是本机 DOM 元素。此外，您确实应该在当前代码中缓存所选元素以使其性能更好。试试这个：

$('div.Body').each(function (index) {
    var div = $('div.Body')[index];
    if (div.scrollHeight > 150) {
        div.style.fontSize = 'small';
        if (div.scrollHeight > 150) {
            div.style.fontSize = 'x-small';
            if (div.scrollHeight > 150) {
                div.style.fontSize = 'xx-small';
            }
        }
    }
});

最后，该代码的逻辑似乎有缺陷，因为所有条件都在检查> 150？

于 2013-01-07T10:13:08.297 回答