0

My problem is very specific, im trying to create online code editor with colored scripts. Im using contenteditable div so i can add span. When im typing the word script the caret is going at the begining of the field, and each time i try add more text the caret again is going at the begining.

If someone helps me to fix this it will help to many people who is trying to do that.

Here's my code:

<html>
<body>

<div contentEditable style="width: 400px; height: 200px; border: 1px solid red;"></div>

<script>
document.querySelector("div").addEventListener("input", function() {
document.querySelector("div").innerHTML= document.querySelector("div").innerHTML
.replace("script","<span style='color:red;'>script</span>");
}, false);
</script>
</body>
</html>
David Pankov
  • 105
  • 1
  • 10
  • http://stackoverflow.com/questions/5595956/replace-innerhtml-in-contenteditable-div http://stackoverflow.com/a/13950376/96100 – Tim Down Nov 02 '14 at 18:52
  • when im using your code to do that : el.innerHTML = el.innerHTML.replace("script", "script"); all the code after "script" word is in red?? why?? – David Pankov Nov 02 '14 at 19:42
  • Have you got a demo page I can see? – Tim Down Nov 02 '14 at 22:00
  • Tim i want to ask you because you are professional. Is there any way to make textarea with line numbers with pure Javascript. I don't need any jQuery code, ajax or plugin. I want to learn how to do that with pure javascript. Can you please assist me?! – David Pankov Nov 03 '14 at 19:06

0 Answers0