如何實(shí)現(xiàn)textarea里的不同文本顯示不同顏色
更新時(shí)間：2014年01月20日 16:32:02 投稿：whsnow
如何實(shí)現(xiàn)textarea里的不同文本顯示不同顏色呢？控制textarea的style設(shè)置Textarea以及把文本放到標(biāo)記里都不會(huì)起作用，下面有個(gè)不錯(cuò)的解決方法，感興趣的朋友可以了解下
如何實(shí)現(xiàn)textarea里的不同文本顯示不同顏色呢？如果是控制textarea的style，則所有文本都是一個(gè)顏色；
如果把文本放到標(biāo)記里，也不會(huì)起作用，是因?yàn)闃?biāo)記不會(huì)被解釋，是當(dāng)做文本處理的。
在網(wǎng)上找到了一個(gè)方法：
我把代碼復(fù)制到txt中，并修改為html格式。測(cè)試起作用。html如下：
復(fù)制代碼 代碼如下:
<html>
<head>
<title>ff</title>
<Script Language="JavaScript">
function ta()
{
//----------------------------
var oFont3=document.createElement("FONT");
var oText3=document.createTextNode('\r');
oFont3.style.color="#00eeff";
form1.topic.appendChild(oFont3);
oFont3.appendChild(oText3);
//----------------------------
var oFont4=document.createElement("FONT");
var tex = "哈哈的哈哈";
var oText4=document.createTextNode(tex);
oFont4.style.color="#00ee00";
form1.topic.appendChild(oFont4);
oFont4.appendChild(oText4);
}
</Script>
</head>
<body>
<form name="form1" action="" method="post">
<textarea id="test" name="topic" rows="10" cols="40"></textarea>
<input type="button" value="提交" onClick="ta()">
</form>
</body>
</html>
將上述代碼復(fù)制到一個(gè)txt中，然后把txt文件改為html文件，例如改為a.html，用瀏覽器打開(kāi)，點(diǎn)擊“提交”
相關(guān)文章
微信小程序?qū)崿F(xiàn)注冊(cè)登錄功能(表單校驗(yàn)、錯(cuò)誤提示)
這篇文章主要介紹了微信小程序 實(shí)現(xiàn)注冊(cè)、登錄功能(表單校驗(yàn)、錯(cuò)誤提示),本文通過(guò)代碼給大家詳細(xì)介紹，需要的朋友可以參考下2019-12-12
js+canvas實(shí)現(xiàn)轉(zhuǎn)盤(pán)效果（兩個(gè)版本）
這篇文章主要為大家詳細(xì)介紹了兩個(gè)版本的js+canvas實(shí)現(xiàn)轉(zhuǎn)盤(pán)效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-09-09
可以支持多中格式的JS鍵盤(pán)...2007-05-05
Javascript實(shí)現(xiàn)圖片懶加載插件的方法
最近由于公司項(xiàng)目需要，要利用Javascript實(shí)現(xiàn)圖片懶加載效果，嘗試起來(lái)發(fā)現(xiàn)并不難，于是將自己的實(shí)現(xiàn)過(guò)程分享出來(lái)給大家學(xué)習(xí)和參考，希望對(duì)有需要的朋友們帶來(lái)一定的幫助，感興趣的朋友們下面來(lái)一起看看吧。2016-10-10
JS 中可以提升幸福度的小技巧(可以識(shí)別更多另類寫(xiě)法)
本文主要介紹一些JS中用到的小技巧，可以在日常Coding中提升幸福度，將不定期更新2018-07-07
微信公眾號(hào)weixin-js-sdk使用方法總結(jié)
最近做了一個(gè)活動(dòng)頁(yè)面,需要自定義微信分享的標(biāo)題、詳情、縮略圖和url,使用到了jssdk,這篇文章主要給大家介紹了關(guān)于微信公眾號(hào)weixin-js-sdk使用方法的相關(guān)資料,需要的朋友可以參考下2022-12-12
JS實(shí)現(xiàn)將手機(jī)號(hào)中間的幾位數(shù)字變成****功能
這篇文章主要介紹了用js如何實(shí)現(xiàn)將手機(jī)號(hào)中間的幾位數(shù)字變成****?_,今天，我們要實(shí)現(xiàn)一個(gè)很常見(jiàn)并且簡(jiǎn)單的功能如何將手機(jī)號(hào)中間的幾位數(shù)變成****，需要的朋友可以參考下2023-09-09
記錄一下這些內(nèi)容只是以后查閱起來(lái)方便，作為自己知識(shí)積累的記錄。其中有很多是參考網(wǎng)絡(luò)上的資源，不再一一寫(xiě)出出處，還請(qǐng)?jiān)髡咭?jiàn)諒。2010-12-12
解析dom中的children對(duì)象數(shù)組元素firstChild,lastChild的使用
以下是對(duì)dom中的children對(duì)象數(shù)組元素firstChild,lastChild的使用進(jìn)行了詳細(xì)的分析介紹，需要的朋友可以參考下2013-07-07
這篇文章主要介紹了JS數(shù)組中對(duì)象去重操作,涉及javascript數(shù)組對(duì)象遍歷、比較、運(yùn)算等相關(guān)操作技巧,需要的朋友可以參考下2019-06-06