1

I am trying to create an text-editor. In this i am using contenteditable div in which i have to create multiple canvas element but when i create it by using 

var A = "<canvas style='border:1px solid' id='matharea'
class='mathdoxformula'></canvas>";
document.execCommand("insertHTML", A,null);

it create problem with cursor, what happen is when backspace is press it delete all the canvas element. I need to delete one by one. I thought this problem is because of no space present in between two elements, but when i create textarea just for check it works fine.

Required Output 1. I can create canvas element at any cursor position 2. Need one cursor distance in between two canvas element, so i can write in editable div in between elements. 3. Delete canvas element one by one

enter image description here

In this image

DARK BOLD BLACK BOX : contenteditable div

BLACK BOX INSIDE DIV : canvas element

RED COLOR LINE : Cursor pointing

I used document.execCommand because to place canvas element at any cursor position. Help me out.

Restriction : Only use JavaScript and HTML

  • Please check your code for quoting errors. The code coloring in the post shows that you've invalid quoting. If it's only in the post, please fix the post. – Teemu Sep 05 '14 at 11:34
  • 1
    there is no error in code. I fixed in the post –  Sep 05 '14 at 11:52

0 Answers0