ソーシャル・マーケティング協会 代表理事 白鳥友康の公式ブログ。Facebook、Twitter、YouTube、LINEなど、ソーシャルメディアを活用、集客する方法を無料でお届け。

ソーシャル★マーケティングの教科書 改訂版

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万円で提供していた【ソーシャル・マーケティング認定コンサルタント養成講座】のエッセンスを凝縮した動画を無料プレゼントしています。

ダウンロードはこちら

  関連記事

no image
Google「Chrome 4」正式版リリース – 拡張機能に対応

お気に入りのブラウザ Chrome の最新版がリリースされました。 「インターネットを見る」と言えば、InternetExplo…

no image
リンクに良く使われている「>>」記号をHTMLで表示する方法

リンクの部分に「»」という記号を「>>」のように2文字ではなく、1文字で表示したい。 そんなときには。 …

tour_1
jQueryを使ってサイトツアーを作る方法

これはいつか使いそう。 というか、必ず使いたい! jQueryを使ってサイトツアーを作る方法 – IDEA*IDEA…

HTML5_logo_and_wordmark.svg
HTML5で廃止予定の要素と属性

ブログなどを使って投稿すると、自動的に挿入されてしまうタグが多数ありますね。 現在でも推奨はされていないが、頻繁に使われているタ…

CMS
★工務店さんのウェブサイトは施工事例がとっても大切。

日々、現場で作業をしていて施工事例はたっぷりあるけれど、自社サイトに最新事例をアップできていない。そんな会社様も多いと思います。…

no image
内部SEO対策:<meta>タグにキーワードとページの要約を記述する

Yahoo!カテゴリに掲載されることが、アクセスアップにとって大きな意味を持っていた時代から、ロボットによる検索結果表示への以降…

2015-11-26 15.59.24
アンカーリンクをクリックした時にスクロールして移動する

ウェブサイトには、クリックするとページ内の指定の場所に移動する「アンカー」という機能がありますよね。 この機能は、普通に指定する…

no image
★毎回好評の《初心者向けホームページ作成セミナー》を開催します

もしあなたが、 ○初めてホームページを作ろうとしている○ホームページの作り方をイチから知りたい なら、次のことを知っておく必要が…

post_h268_20130103
Facebookだけじゃダメ。他のメディアも使わないと!

Facebookを活用して集客することはもちろん可能ですが、Facebookは他のメディアと組み合わせてこそ、その本領を発揮しま…

no image
ウィンドウを2分割して表示するChromeのアドオン「Split Screen」

ホームページ制作をしていると、表示のチェックするために複数のブラウザウィンドウを開くので、デスクトップにウィンドウがたくさんあっ…