blog.longkey1.net

自前でブログシステムを作ったので、編集機能なんて皆無。
で、WYSIWYGエディタなるものはもっさりするで、タグを挿入出来るような簡単なものをJavascriptで作って使っていた。

Firefoxをメインで使っているので、Firefoxしか対応してないけど晒してみる。

function pack_tags(tags)
{
	/* この機能は今のところMozilla系しか対応してません！ */

	// タグの生成
	tags_sta = '<'  + tags + '>';
	tags_end = '</' + tags + '>';

	// テキストエリアのエレメントを取得
	var contents = document.getElementsByName("contents")[0];

        // スクロール位置を取得
	st = contents.scrollTop;

	// カーソル位置を取得
	sn = contents.selectionStart;
	en = contents.selectionEnd;

	// 選択している文字列より前後の部分を取得
	before	= contents.value.substring(0,sn);
	after	= contents.value.substring(en,contents.value.length);

	// 選択している文字列を取得して、前後にリンクタグを埋め込む
	string	= contents.value.substring(sn,en);
	result	= tags_sta + string + tags_end;
	contents.value = before + result + after;

	// カーソル位置を移動
	contents.scrollTop = st;
	contents.setSelectionRange(sn, sn);
}

やっていることはコメント見れば大体わかるかな。
いちいちスクロールの場所を覚えておいて、再度最後にセットしてあげないと先頭にスクロールしてしまうってのが、なんだか面倒だなーと思った。

これで

onClick="pack_tags('pre')"

みたいな感じでリンクとか張って呼び出してあげると、選択した部分をpreタグ囲ってくれる。

僕にはこんなもんで十分かな。