js的textarea中字体颜色改变问题

做打字速度测试啊?用编辑的DIV实现

自己想思路去吧
<textarea id="test" rows="5" cols="60" oncopy="return false">abcdefghijk</textarea><script language="javascript">
var red = document.createElement("font");
red.color="red";
red.innerText="a";
test.appendChild(red);
</script>

应该是web编辑器把，数据框能够输入不同颜色的字吗？css控制的不算

这个我已经试了很久了，还是不能实现功能。 leohuang(LEO) ( ) 信誉：99    Blog   加为好友  2007-04-27 22:49:54  得分: 0

   自己想思路去吧
<textarea id="test"  rows="5" cols="60" oncopy="return false">abcdefghijk</textarea><script language="javascript">
var red = document.createElement("font");
red.color="red";
red.innerText="a";
test.appendChild(red);
</script>

leohuang(LEO) 的做法有意思，开眼了谢谢 LZ 的问题，俺去帮 LZ 试试看，哈

FF不兼容leohuang(LEO) 的做法啊？怎么办？

还是用可编辑DIV吧，leohuang(LEO)的好像可行，不过我的IE一刷新页面就死掉了，而且这个在其它浏览器也不行

还要考虑兼容性的问题呀，那就只能模拟了，不过应该也不难！俺先按 leohuang(LEO) 的思路做一个玩玩

IE 6 下可用，L@_@K<body>
<textarea id="divTest"  rows="5" cols="30">abcdefghijk</textarea>
<textarea id="divInput" rows="5" cols="30"></textarea>
  <script language="JavaScript">
  
  </script>
</body>

如果模拟的话，就把 <textarea id="divTest" rows="5" cols="30">abcdefghijk</textarea>
换成 div 即可
如果输入有误，就让 div 中相应位置的字符变色！

<html>
<head>
<title></title>
<SCRIPT language="JavaScript">
function Testing()
{
    var inputText = document.getElementById("input").value;
    var chr = document.getElementById("test").value.substr(inputText.length, 1);    if (String.fromCharCode(event.keyCode) != chr)
    {
        var errChar = document.createElement("font");
        errChar.color="red";
        errChar.innerText = String.fromCharCode(event.keyCode);
        document.getElementById("input").appendChild(errChar);
        event.returnValue = false;
    }
}
</SCRIPT>
</head>
<body>
<textarea id=test  rows=5 cols=60 oncopy="return false">abcdefghijk</textarea>
<textarea id=input  rows=5 cols=60 onpaste="return false" onkeypress="Testing()"></textarea>
</body>
</html>

上面两端代码都可以实现英文，可是能否实现中英文混合输入呢？而且需要两个textarea都变颜色，请教各位大大，谢谢拉

在线编辑器
ifrmae设置编辑状态,选中并用insertHTML

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
※以下是引用21楼 wenbinsong() 在2007-04-28 13:11:05 的发言：
──────────────────────────────────────────
用AJAX很简单的
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
由此可见AJAX的概念被滥用到什么程度了...
这关AJAX什么事...
纯JS问题

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
※以下是引用17楼 youmiao666(西方之猪) 在2007-4-28 11:47:49 的发言：
──────────────────────────────────────────
上面两端代码都可以实现英文，可是能否实现中英文混合输入呢？而且需要两个textarea都变颜色，请教各位大大，谢谢拉
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
如果要求中文的话能难做到了
至少要用三个textarea,因为你要这样做必须要用到onpropertychang事件,如果只用两个textarea会陷入死循环

请看下第二步需要用什么方法？
（1）首先创建一个TextRange()：
var SearchRange = document.body.createTextRange();
（2）然后选中test（如题）中的第四个字母：（3）最后换为我要显示的效果：
HtmlEdit1.document.body.createTextRange().pasteHTML(html);

<div ></div>有个属性可以使之能编辑，具体属性是什么，我忘了，自己找一下，用div代替textarea 实现以上功能

div可编辑是contenteditable属性，比如
<div contenteditable>这些是可以编辑的</div>
FF下用designMode

调试易

js的textarea中字体颜色改变问题

解决方案 »