2011-09-10 17 views
3

選択したテキストをテキストボックス内で太字にしたいが、起こっていないように書式を設定しようとしている。しかし、それはspan/divでうまくいく。私のコードテキストボックス内のテキストの書式設定

<html> 
<head> 
<title>Untitled Document</title> 
<script type="text/javascript"> 
function FormatSelectedWord(txtBox,style) 
{ 

var selectedText = document.selection 
? document.selection.createRange().text 
: txtBox.value.substring(txtBox.selectionStart,txtBox.selectionEnd); 

if(selectedText!='') 
{ 
var newText='<'+style+'>'+selectedText+'</'+style+'>'; 
txtBox.value=txtBox.value.replace(selectedText,newText) 
spOutput.innerHTML=txtBox.value; 
} 
} 
</script> 
</head> 
<body> 


<input type="text" name="txtBox"> </input> 
<input type="button" value="Bold" onclick="FormatSelectedWord(txtBox,'b')"> 
<span id="spOutput"></span> 
</body> 
</html> 

テキストボックスを挿入することは可能ですか?もしそうなら、どのように?

おかげ

答えて

3

にする必要がありません、それはテキストボックス内のテキストのスタイルを設定することはできません。編集可能な書式設定されたテキストが必要な場合は、divまたはspan contentEditable = trueにすることができます。

+0

どのように私はこれについて知りませんでしたか? – Marcel

0

よりむしろ再発明ホイールは、あなたがTinyMCEまたはこれを行い、いくつかの他、同じようなことを実装を見方がいいでしょう - それは非常に簡単です。あなたは本当にそれは非常に一般的に機能した後に求められています、それはあなた自身がワームの巨大缶であるこの種の機能を追加しようと:)

をグーグルで行きたい場合のために、「リッチテキストエディタ」と呼ばれる、と参加したくない:)ここ

0

は、私はあなたが欲しいと思うものの一例である:http://jsfiddle.net/6gQJC/1/

、ここではあなたが尋ねたものです:http://jsfiddle.net/6gQJC/

txtBox is undefined 

ので、この:

<input type="text" name="txtBox"> </input> 

<input type="text" id="txtBox" name="txtBox"> </input> 

、その後

function FormatSelectedWord(txtBox,style) 
{ 
    var textbox = document.getElementById('textBox'); 
関連する問題