JavaScriptで選択したテキストをラッピング
このブログにJavaScript経由で辿り着かれる方がけっこういるので、「JavaScriptでカーソルの位置に文字を挿入 その２」に書いたソースの応用編で「選択したテキストのラッピングの仕方」を書いておきます。前回と同様ソースは最小限しか書きません。変数の名称を出来るだけヒントを与えるものにしてありますので、応用して使ってみてください。
まずはHTMLのソース。
<html>
<head>
<title>
</title>
<script type="text/javascript" src="wrap.js">
</script>
</head>
<body>
<input type="button" value="Hogehoge" onclick="wrap()" />
<textarea id="txtarea" cols="50" rows="10">
</textarea>
</body>
</html>
wrap.jsの内容は下記の通りです。
function wrap(){
var tag1 = '
var tag2 = '
var area = document.getElementById('txtarea');
var bun = document.getElementById('txtarea').value;
var nagasa = bun.length;
var hajimari = area.selectionStart;
var owari = area.selectionEnd;
var mae = bun.substr(0, hajimari);
var naka = bun.substr(hajimari, owari-hajimari);
var ushiro = bun.substr(owari, nagasa);
document.getElementById('txtarea').value = mae + tag1 + naka + tag2 + ushiro;
}
これでtextareaに書いた文章の一部をマウス等で選択してボタンを押すと、選択した部分が<HOGE></HOGE>タグにくくわれます。SafariとFirefoxでしか実験していません。
« 富士通 MHY2BH | トップページ | Boot Campパーティションにデフラグをかけてしまいました．．． »
この記事へのコメントは終了しました。
« 富士通 MHY2BH | トップページ | Boot Campパーティションにデフラグをかけてしまいました．．． »
コメント