JavaScriptコーディング

ボタンクリックでテキストエリアに文字挿入

2008年11月26日
自前ブログもほぼ出来上がりました。Movable Typeの記事投稿画面で使いづらいと感じるところを改善した投稿画面にします。と言っても、見た目は(デザイン)しょぼいんですが。


使いづらい点は、
・アンカータグにtitle属性、rel属性が入らない
・html特殊文字が入れられない
です。


アンカータグを入れるボタンがありますが、
<a href="" ></a>
という最低限のタグが挿入されます。

これを、
<a href="" title="" rel="nofollow"></a>
としたいのです。

いちいちhtmlエディタを立ち上げたり、サイトを表示させたりしてタグをコピーするのは面倒です。

html特殊文字、例えば、【&lt;】、【&gt;】などです。
これも今まではいちいちエディタを立ち上げてコピーしてました。

覚えられればいいのですが、すぐ忘れてしまうので・・


画面にボタンを表示させ、クリックすると入力エリアに文字を入れます。
JavaScriptでコーディングします。と言ってもとっても簡単なソースです。
カーソルのあるところに挿入するのが本来ですが、面倒なので、入力エリアの最後に文字をくっつけます。

PHP側
<form method="post" action="" name="frmINS">
 <input type="button" value="&lt;" onClick ='function()'>
 <textarea name="body" cols="80" rows="40" wrap="soft"></textarea>
</form>

JavaScript側
function function(){
  document.frmINS.body.value = document.frmINS.body.value + '&lt;';
}


これで、【&lt;】ボタンをクリックすると、テキストエリアに【&lt;】が追加表示されます。