4

次のことを行うための JavaScript の作成方法 - ユーザーが「BOLD」ボタンをクリックすると、選択したテキストが「<b>」と「</b>」で囲まれます。

 <form name="my">
<textarea name="textarea"></textarea><br />
<input type="button" value="bold" onclick="formatText ('b');" />
<input type="button" value="italic" onclick="formatText ('i');" />
<input type="button" value="underline" onclick="formatText ('u');" />
</form> 

ほとんどの Web ブラウザをサポートするための Java スクリプトの作成を手伝ってください

4

4 に答える 4

1

既存のリッチテキストエディターを使用する必要があります。これらは構成可能であるため、ユーザーが使用したい機能のみをユーザーに提供できます。また、さまざまなブラウザで動作するという追加の利点もあります。

太字、斜体、下線のみを使用してtinyMCEを設定する例。

tinyMCE.init({
    // General options
    mode : "textareas",
    theme : "advanced",

    // Theme options
    theme_advanced_buttons1 : "bold,italic,underline"
});
于 2012-06-23T14:21:25.283 に答える
0

以下のスクリプトを試してください...

<script>
 function formatText (key){

    var elem = document.my.textarea; 
    /*start of selection area*/ 
    var start = elem.selectionStart;
    var end = elem.selectionEnd;
    var len = elem.value.length;
    var sel_txt = elem.value.substring(start,end);

    if (sel_txt != ""){
      var begin_tag = "<"+key+">"; 
      var close_tag =  "</"+key+">";
      var replace = begin_tag + sel_txt + close_tag;
      elem.value = elem.value.substring(0,start) + replace + elem.value.substring(end,len);
   }
</script>

http://jsfiddle.net/VRqU3/でスクリプトを試しました。これをチェックしてください。

それがあなたのために働くことを願っています、ありがとう、

于 2012-06-23T14:10:26.150 に答える
0

これは、textarea要素のプロパティをサポートselectionStartしないIE <9がなければ、比較的簡単です。selectionEndこれを行う方法を詳しく説明している私の以前の回答は次のとおりです。

https://stackoverflow.com/a/10739034/96100

于 2012-06-23T14:11:49.467 に答える
-1

この機能を試してください:

function formatText(tag) {
   var Field = document.getElementById('text');
   var val = Field.value;
   var selected_txt = val.substring(Field.selectionStart, Field.selectionEnd);
   var before_txt = val.substring(0, Field.selectionStart);
   var after_txt = val.substring(Field.selectionEnd, val.length);
   Field.value = before_txt + '<' + tag + '>' + selected_txt + '</' + tag + '>' + after_txt;
}

例: http://jsbin.com/ilecug/
ソース: http://jsbin.com/ilecug/edit

于 2012-06-23T14:01:20.737 に答える