更改特定代码后的字体颜色

时间:2012-09-16 10:26:59

标签: javascript html colors

当在textarea中输入类似^ 1的代码时,我希望将该代码后的任何文本的字体颜色更改为^ 1所分配的任何颜色,

截至目前,我有以下内容:

<form method="post" action="index.php">
<textarea id="text" onkeypressed="changecolor()"></textarea>
<input type="submit" value="Add">
</form>

的javascript:

function changecolor() { //code here }

所以基本上当我输入^ 1并且蓝色被分配给该代码时,该代码之后的文本将为蓝色,但是当输入第二个代码时;例子^ 2之后的文本将是分配给该代码的颜色,

我非常清楚如何将数据插入数据库,但我需要找到一种获取原始数据的方法;即使用^ 1和^ 2

等代码在文本区域中输入的数据

非常感谢帮助!

1 个答案:

答案 0 :(得分:0)

您无法在textarea中定位文本的特定片段。除非你监视它的内容并添加一个抽象的div层来从中输出样式化的html,否则你不能做我想知道的事情。 许多所见即所得的文本编辑器都是这样做的,或者使用'contenteditable'属性来允许在现代浏览器中进行html编辑...... 你可以这样开始:

<script type="text/javascript">
    var display, input, displayHtml;
    function init(){
       display = document.getElementById('display');
       input = document.getElementById('input');
    }
    function onContentChange(){
        displayHtml = parseContent(this.value);
        display.innerHtml = displayHtml;
    }
    function parseContent(text){
        var html = ... // Generate html according to content
        return html;
    }
    document.onload=init;
</script>

HTML:

<textarea id='input' onkeypress="javascript:onContentChange" />
<div id='display'></div>