1

I have a div which has a contenteditable="true" attribute. Inside it the user can type randome text. Also, through some process i create html5 canvas and append to the div.

So, a sample view of my div would be

<div contenteditable="true">
Some free text type by the user <canvas ...></canvas> some more text... etc etc...
</div>

So, my problem is, when the user has the cursor at the end of the text (div), and starts erasing with the Backspace Key, on IE it all works fine. But on chrome, the text at the end will start being eradse, then the cursor will jump the 2nd canvas to erase the beginning text and at the end once all free text are erased, it will erase the canvas.

So Weird, help is much appreciated.

Thanks,

Nisho
  • 365
  • 1
  • 3
  • 14
  • Please provide an example, I am unable to reproduce the situation – Zach Saucier Dec 02 '13 at 21:27
  • Well @ZachSaucier that's the example of the code i have. Just copy paste it in an html file, open it in Chrome, and start erasing from the end. It Will erase all the free text and then clear the canvases, whereas i want it to erase by order. That means, erase the last Text, then remove the 2nd Canvas, and then erase the text at the beginning. – Nisho Jan 28 '14 at 20:43
  • 1
    [This may help](http://stackoverflow.com/questions/17890568/contenteditable-div-backspace-and-deleting-text-node-problems/18069930#18069930) – Zach Saucier Jan 28 '14 at 20:51
  • Wow Seems soo interesting... I'll get back with my results. @ZachSaucier – Nisho Jan 29 '14 at 23:54
  • That post was great but this solved my problem @ZachSaucier http://stackoverflow.com/questions/2239821/backspace-doesnt-delete-inner-html-tags-of-a-contenteditable-div-in-firefox/2278856#2278856 – Nisho Jan 30 '14 at 16:07

0 Answers0