Escribir apartir de un determinado caracter en un textarea
Publicado por ale (1 intervención) el 18/11/2019 22:04:23
Hola estoy haciendo un editor de codigo online y necesito que determinadas palabras cambien su color por lo que use un div y lo hice editable, despues hice una funcion que agrega etiquetas span con el estilo que deseo, y lo finalizo usando un innerHTML mi problema es que en cuanto el innerHTML se ejecuta el puntero para escribir vuelve al inicio haciendo imposible escribir en donde te quedaste
Es posible hacer que no cambie el puntero o en su defecto devolverlo a la posicion donde estuvo antes de la ejecucion el innerHTML
Es posible hacer que no cambie el puntero o en su defecto devolverlo a la posicion donde estuvo antes de la ejecucion el innerHTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function lala(){
contenido = document.getElementById('area').textContent;
busqueda(contenido);
}
function busqueda(cadena){
for(let i = 0;i<reservadas.length;i++){
if(cadena.indexOf(reservadas[i])!=-1){
var str = document.getElementById("area").innerHTML;
var res = str.replace(/break|case|class|catch|const|continue|debugger|default|delete|do|else|export|extends|finally|for|function|if|import|in|instanceof|let|new|return|super|switch|this|throw|try|typeof|var|void|while|with|yield/gi, function (x) {
return "<span style='color:blue;'>"+x+"</span>";
});
document.getElementById("area").value = res;
}
}
console.log(document.getElementById("area"));
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script defer src="{% static 'js/index.js' %}"></script>
<title>Document</title>
</head>
<body>
<div id="area" style="border: solid 1px;width: 80%; height: 100px;" onkeypress="lala();" contenteditable="true">
</div>
</body>
</html>
Valora esta pregunta


0