格式化文本框內的部分文本

假設您的網頁中有文本字段。文本字段中的值是「這是您的歡迎文本」。有沒有什麼辦法可以提供紅色給「歡迎」，而不是其他字眼。格式化文本框內的部分文本

簡而言之，在文本字段中的某些文本部分應用樣式。

可以有人建議一種方法嗎？

2010-08-11 alter

你的意思是一個文本框？ – SLaks 2010-08-11 15:53:24

是的我的意思是 – alter 2010-08-11 16:04:24

不帶有文本字段。你可以使用一個div或contentEditable一些其他的元素設置

<div contentEditable="true"> 
This is your <b style="color:red";>welcome</b> text 
</div>

但也有具體取決於您希望與文本做什麼注意事項。

2010-08-11 15:56:17 RoToRa

嘿我試過了，但看起來只讀！ – alter 2010-08-11 16:12:30

糟糕。更改了屬性值。 – RoToRa 2010-08-12 13:59:21

不可能，除非你正在使用某種rich text editor，如CKEditor，TinyMCE等。但我不認爲這將是值得納入一個豐富的編輯器這樣的小任務值得。

2010-08-11 15:53:32 Sarfraz

我試圖執行某種字典搜索，以便當您在文本字段中鍵入錯誤的單詞時，該單詞變爲紅色而不是在文本上提供紅色邊框-領域。我嘗試將文本節點附加爲文本字段的子節點，但這些文本節點都是作爲innerHTML而不是成爲它的值。 – alter 2010-08-11 16:09:09

@alter：正如我所說的，除非您使用某種富文本編輯器，例如我在答案中顯示的內容，否則無法將簡單的文本字段顯示爲顯示文本不同部分的多種顏色。 – Sarfraz 2010-08-11 17:40:31

除了適用於其中所有文本的CSS樣式之外，您不能在<textarea>中執行任何樣式。大多數富文本編輯器所做的是以編程方式將設置爲true的iframe替換爲iframe。他們的方式使其無縫化是相對先進和複雜的，但可以完成。

我會推薦使用現成的富文本編輯器來滿足您的需求，但是如果您想讓自己的產品有足夠多的resources available。

2010-08-11 15:57:37 tj111

RoToRa的權利，除了你需要使用TRUE，不是的。

下面的代碼有效。您將不得不更多地使它看起來像一個文本框。例如，在Firefox中，當您單擊它時，周圍會出現一個醜陋的邊框。但這就像你想要的東西。

<div contenteditable="true" style="width:200; border:1px solid black; padding:1.5;"> 
This is your <b style="color:red";>welcome</b> text 
</div>

嘗試使用CSS對其進行設置，而不是使用內聯樣式。既然你有很多的文本框，這將是更好的方式。我只是用內聯樣式來做這件事，讓你知道如何讓它看起來更像一個文本框。邊框和輕微的填充。然後你還需要製作一些可滾動的div。但這是一個不同的問題。

2010-08-11 17:06:24 Dalal

真棒....這正是我正在尋找的。謝謝：） – alter 2010-08-11 17:54:21

回答