- ベストアンサー
入力支援機能
テキストエリア内で入力中にテキストエリアの外にあるボタンをクリックすると入力した文字が太字(strongタグを追加)になったり斜字体(iタグを追加)になったりする機能を見かけますがあれはJavascriptですか?どうやって書いているのか教えてください。お願いします。
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
#2>Bのボタンを押したら<b></b>が挿入されるのはどうやっているんでしょうか? 大分簡略したものですが、一例(IEとFirefox で動作確認しています) 実際は、それぞれのブラウザやバージョンを調べて、適用できるメソッドなどを(ラップして)切り換えたりしていると思われます。 もっと良いやり方もあるかも知れません。 ---------------------------------------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=SHIFT_JIS"> <title>サンプル</title> <script> <!-- function bold(){ if(document.all){ //IE var str=document.selection.createRange().text; document.selection.createRange().text="<b>" + str + "</b>"; } else { //Firefox var el=document.getElementById('text'); var sPos = el.selectionStart; var ePos = el.selectionEnd; var str = el.value.substring(sPos, ePos); el.value = el.value.substring(0, sPos) + "<b>" + str + "</b>" + el.value.substr(ePos); } } function italic(){ if(document.all){ //IE var str=document.selection.createRange().text; document.selection.createRange().text="<i>" + str + "</i>"; } else { //Firefox var el=document.getElementById('text'); var sPos = el.selectionStart; var ePos = el.selectionEnd; var str = el.value.substring(sPos, ePos); el.value = el.value.substring(0, sPos) + "<i>" + str + "</i>" + el.value.substr(ePos); } } //--> </script> </head> <body> <form name="FORM1"> <input type="button" value="Bold" onclick="bold()"> <input type="button" value="Italic" onclick="italic()"><br> <textarea ID="text" cols="80" rows="10"> test data 最後の行 </textarea> </form> </body> </html>
その他の回答 (2)
- BLUEPIXY
- ベストアンサー率50% (3003/5914)
参考URLが参考になるかも・
- yambejp
- ベストアンサー率51% (3827/7415)
とりあえずこんな感じでしょうか? <html> <head> <script language="javascript"> window.onload=function(){ taStyle=document.getElementById('ta').style; } </script> </head> <body> <form> <textarea id="ta" rows=10> テストテストテスト テストテストテスト テストテストテスト </textarea> <input type=button value="斜体" onClick="taStyle.fontStyle=(taStyle.fontStyle=='italic')?'':'italic';"> <input type=button value="太字" onClick="taStyle.fontWeight=(taStyle.fontWeight=='bold')?'normal':'bold'"> </form> </body>
補足
ブログの管理画面でBのボタンを押したら<b></b>が挿入される入力支援がありますよね・・・。あれはどうやっているんでしょうか?javaSCRIPTですか?