この Blog の記事書き込み欄の上には、[URL] [B] [i] [U] の４つのボタンがついていまして、これは JavaScript で動作するタグ自動挿入のボタンです。DION の LOVELOG の場合、JavaScript のソースが別ファイルなっていますが、
http://blog.dion.ne.jp/js/misc.js
にアクセスすればダウンロードして見ることができます。どれもテキストエリア内の選択語句を拾い、その語句の前に開始タグを後ろに終了タグを挿入する仕組みになっています。
ではテキストエリア内の任意の場所に、選択した語句の前後でなく単独でタグを挿入できないでしょうか。これはちょっと簡単に思えますが、意外と難しいようです。選択語句は、
document.selection.createRange().text
で得られますが、テキストエリアにカーソルを置くことで得られるテキストの書き込み位置は、テキストエリア左端からのＸ座標や、テキストエリア上端からのＹ座標を調べないとできないようです。それでネットの検索で色々調べ、それらしきスクリプトから必要と思われるものを抽出して繋ぎ合わせてみました。ですので、ちょっと余分なものも含まれているかも知れません。ちょっとここに書くと長くなりますので、これらのスクリプトを使って作りました「タグ学習ボード」なるものを見て下さい。
このソースファイルのソースをご覧下さい。ご自分に便利なように色々改造したら、使い道があるかも知れませんね。ご自由にお使い下さい。ただ、まだ時々書き込み位置が正しく認識されずに、あらぬ場所にタグが挿入されることがたまにあります。(^^;)
コメント