あまねこ TOP  >  スポンサー広告 >  javascript >  jQueryで選択範囲の文字列を操作できるプラグイン jQuery.selection

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
[ --年--月--日 --:-- ] カテゴリ:スポンサー広告 | TB(-) | CM(-)

jQueryで選択範囲の文字列を操作できるプラグイン jQuery.selection

これはすごい(こなみかん

選択範囲のテキストボックス内の文字列を処理したいことは時々あること。
しかしながら一発で実装できるメソッドはJavascriptには用意されておらず自分で書くのは非常に面倒。
だが、jQueryプラグインjQuery.selectionを使えば一行で実装可能。凄い

簡単なデモサイト
jQuery.selection - jQuery plugin
API仕様
API · madapaja/jquery.selection Wiki · GitHub

使い方は簡単。あらかじめjquery.selection.jsをここからダウンロードして読み込ませる。jQueryも忘れずに。

以下はScriptの内容。
jQuery(document).ready( function(){
//選択テキストをアラート表示
$('#getSelTxt').click(function(){
alert($('#textarea').selection());
//フォーカスを元に戻す
$('#textarea').focus();
});
//選択テキストを置き換え
$('#replaceSelTxt').click(function(){
$('#textarea').selection('replace', {text: '変更後の文章'});
});
//選択テキストの前後に文字列を挿入
$('#insertTxt').click(function(){
$('#textarea').selection('insert', {text: '', mode: 'before'});
$('#textarea').selection('insert', {text: '
', mode: 'after'});
});
});
で、htmlコードはこんな感じ





今回はChrome27で正常に動作することが確認できた。
関連記事
[ 2013年07月29日 15:59 ] カテゴリ:javascript | TB(0) | CM(0)
コメントの投稿












管理者にだけ表示を許可する
トラックバック
この記事のトラックバックURL



上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。