jquery - 根据字数 Jquery 设置字体大小

我有多篇文章，但它们都需要放在同一个空间中。字符限制为 140。我要做的是根据段落中的字符调整字体大小。因此，如果段落的字符较少，我希望字体大小变大，反之亦然。

我下面的代码似乎不起作用，想知道是否有人能够帮助我？

目前发生的事情，似乎是最后一个，因为所有段落的字体大小都是 8em :(

非常感谢任何帮助和提前致谢!

这是代码:

    $(function(){
    var $quote = $(".question p");
    var $numWords = $quote.text().split("").length;
    if (($numWords >= 1) && ($numWords < 20)) {
        $quote.css("font-size", "2.2em");
    }
    else if (($numWords >= 20) && ($numWords < 60)) {
        $quote.css("font-size", "1.8em");
    }
    else if (($numWords >= 60) && ($numWords < 100)) {
        $quote.css("font-size", "1.2em");
    }
    else if (($numWords >= 100) && ($numWords < 140)) {
        $quote.css("font-size", "0.9em");
    }
    else {
        $quote.css("font-size", "0.8em");
    }
});

最佳答案

您的问题是您没有单独处理每个段落:请参阅 http://jsfiddle.net/wkEMK/1/

$(function(){
    $(".question p").each(function () {
        var numChars = $(this).text().length;
        if ((numChars >= 1) && (numChars < 20)) {
            $(this).css("font-size", "2.2em");
        }
        else if ((numChars >= 20) && (numChars < 60)) {
            $(this).css("font-size", "1.8em");
        }
        else if ((numChars >= 60) && (numChars < 100)) {
            $(this).css("font-size", "1.2em");
        }
        else if ((numChars >= 100) && (numChars < 140)) {
            $(this).css("font-size", "0.9em");
        }
        else {
            $(this).css("font-size", "0.8em");
        }
    });
});

您的原始代码正在获取与“.question p”匹配的所有段落的字符数。例如如果您有两个段落，一个有 10 个字符，另一个有 20 个字符，那么您的 JS 将运行一次总共 30 个字符，而不是依次处理每个段落。

关于jquery - 根据字数 Jquery 设置字体大小，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/14885452/