Question

我有一个div，我想检测它的长度;如果它是10或更多，我希望它以较小的字体大小显示。

＆＃13;

$(window).load(function() {
  function adjustFontSize() {
    var theTitleLength = $('.article-title-on-list').text.length;
    if (theTitleLength >= 10) {
      $('.article-title-on-list').css('font-size', '1.5rem');
    } else {
      $('.article-title-on-list').css('font-size', '2rem');
    };
  };
  adjustFontSize();
};

＆＃13;

<div class="article-title-on-list">12345678901234567890</div>

＆＃13;

该功能无声地失败。

Answer 1

text是方法，而不是属性。使用.text()代替.text

 var theTitleLength = $('.article-title-on-list').text().length;

Answer 2

我已使用.each（）函数更新了我的代码。如果有人想要使用它：

＆＃13;

$('.article-title-on-list').each(function() {
  var theTitleLength = $(this).text().length;
  console.log(theTitleLength);
  if (theTitleLength >= 14) {
    $(this).css('font-size', '1.7rem');
  } else {
    $(this).css('font-size', '2rem');
  };
});

＆＃13;

<div class="article-title-on-list">12345678901234567890</div>
<div class="article-title-on-list">123456789012345678901234567890</div>
<div class="article-title-on-list">1234567890</div>

＆＃13;

再次感谢Nathan的帮助。

如果div的字符串长度大于10，则字体大小较小

2 个答案: