jQueryでたった5行の記述で長いテキストを「…」で省略する（全角半角区別）

by iwbjp

HTML

<div class="abbr">テキストが入ります。全角6文字からは「･･･」が表示される。</div>
<div class="abbr">テストabcde</div>

JavaScript

$(".abbr").each(function(){
  var size = 5;
  var txt = $(this).text();
  var suffix = '…';
  var b = 0;
  for(var i = 0; i < txt.length; i++) {
    b += txt.charCodeAt(i) <= 255 ? 0.5 : 1;
    if (b > size) {
      txt = txt.substr(0, i) + suffix;
      break;
    }
  }
  $(this).text(txt);
});