JavaScriptでマルチバイト文字列を決まった長さで省略する方法
投稿日時：
最終更新日時：2015/03/16 20:03
この記事は約 2 分で読めます。
大丈夫、あなたなら出来る！
ソーシャル・マーケティング協会 代表理事の白鳥友康です。
ブログの「続きを読む」みたいなことを、JavaScriptで実現する方法です。
デザインの都合でエリアに入力できる文字数が決まっていて
マルチバイトで○文字分みたいな切り出しをしたい場合があります。
でもマルチバイトとシングルバイトが混合している文字列の場合、
JavaScriptだと、これがなにげに難しかったりしますね。
そんなときはに役立つサンプルスクリプトです。
/**
文字列を省略する
@arg text 省略する文字列
@arg len 半角文字数で指定
@arg truncation 省略時の文字列
*/
function substr(text, len, truncation) {
var count = 0;
var str = '';
for (i=0; i
n = escape(text.charAt(i));
if (n.length < 4) count++; else count+=2;
if (count>len) {return str+truncation;}
str += text.charAt(i);
}
return text;
}
無料プレゼント
【Web担当者向け】SNS集客の全体像を55分で把握できる動画
受講料50万円で提供していた【ソーシャル・マーケティング認定コンサルタント養成講座】のエッセンスを凝縮した動画を無料プレゼントしています。
関連記事
-
-
【広告を出すのが怖い】と思ったことがありますか？
「はい」と答えた人はどれくらいいるでしょうか？ 結構、多いのではないかと思います。何を隠そう、自分も怖かったですし。 ホームペー…
-
-
HTML5のcanvasでランキング描画 – まつぼっくりんご
こうゆうのは後々使うときありますね。canvasはアイディア次第でいろいろと。 HTML5のcanvasでランキング描画 …
-
-
マウスオーバーの魅せ方
中央に三つならんでいる写真にマウスオーバーすると･･･ Ajaxをうまく活用してますね?ｊQuery使用のようです。
-
-
ホームページ作成用語集：インターネット
世界中のコンピュータを繋いだネットワークのこと。 インターネットに接続することで、電子メールのやり取りやホームページを見ることが…
-
-
アンカーリンクをクリックした時にスクロールして移動する
ウェブサイトには、クリックするとページ内の指定の場所に移動する「アンカー」という機能がありますよね。 この機能は、普通に指定する…
-
-
IE5.5, IE6, IE7, IE8の確認が同時にできる -IETester
ホームページを公開するときに大切なのが、複数のブラウザで表示を確認すること。 Internet ExplorerFirefoxG…
-
-
30秒ですっきり! 理系のためのオフィス系ストレッチ
パソコンを１日中使っている仕事柄ものすごーく肩がこります。 スポーツクラブに通ってはいてもそう頻繁には行けないので、 そんな時は…
-
-
エントリーフォーム最適化（EFO）でお問い合わせの数を増やす。その2
前回、エントリーフォーム最適化（EFO）の大切さについてお伝えしましたが、今回は実際にどの部分を修正すれば良いのかを説明していき…
-
-
★売上とホームページ作成スキルの関係は？
こんにちは。ウィズダム・デザインの白鳥です。 ★自分のホームページ制作のスキルに満足していますか？ ホームページ制作のスキルは、…
-
-
★ホームページ診断で必ずチェックしたい指標
弊社でウェブサイト診断を行う際のチェック項目は、たくさんあるのですが、まずはアクセス解析のデータをチェックして欲しいです。 アク…