Hello,
I've been working on a solution for syntax coloring inside a textarea for quite a while now, and as far as my experience goes, it is absolutly impossible. The textarea just wasn't meant to work this way, however I have gotten real close to atleast fabricating the effect. Check out what I've done and see if you can take this script any farther. Please if you come up with anything then please post what you get.
--------------------------------------------------------
Here's my code:
good luck!
co
I've been working on a solution for syntax coloring inside a textarea for quite a while now, and as far as my experience goes, it is absolutly impossible. The textarea just wasn't meant to work this way, however I have gotten real close to atleast fabricating the effect. Check out what I've done and see if you can take this script any farther. Please if you come up with anything then please post what you get.
--------------------------------------------------------
Here's my code:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml"[/URL] xml:lang="en" lang="en">
<head>
<script type="text/javascript">
clssNodeArr = new Array();
//e element
//v class value
function createClassNodeArr(e,v){
if(document.getElementsByTagName){
var nodes = document.getElementsByTagName(e)
var max = nodes.length
for(var i = 0;i < max;i++){
var nodeObj = nodes.item(i);
var attrMax = nodeObj.attributes.length
for(var j = 0; j < attrMax; j++){
if(nodeObj.attributes.item(j).nodeName == 'class'){
if(nodeObj.attributes.item(j).nodeValue == v){
clssNodeArr[clssNodeArr.length] = nodeObj
}}}
}
}}
</script>
<script>
function checkit(){
if(document.script.content.value == "<script>")
styleByClass("red");
else
{
alpha = new Array("a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z","0","1","2","3","4","5","6","7","8","9");
x=0;
if(x>=alpha.length){
x=0;
}
styleByClass("blue");
x++;}}
</script>
<script>
function styleByClass(clr){
if(document.getElementsByTagName)//check for obj
{
var max = clssNodeArr.length
for(var i = 0;i < max;i++)
{
var nodeObj = clssNodeArr[i];
nodeObj.style.color = clr;
}
}
}
</script>
</head>
<form name="script">
<body onload="createClassNodeArr('textarea','keyWord')">
<textarea class='keyWord' onPropertyChange="checkit()" name="content" id="main" style="border:black 1px solid" cols=20 rows=20>
</textarea>
</form>
</body>
</html>good luck!
co