2

I have a simple content editable div with certain width and height now, I want to fire an event when cursor reaches end of the content editable div and also the end of the line.

Use Case: Something like google docs when user reaches the end of the page it inserts the new page

When cursor reaches the end of the div while typing, I should be able to fires and event which will trigger some dom changes or display a notice that you can not type more chars in it.

We don't want a limit on number of chars or words in the div instead it should (I guess) be based on cursor offset from the bottom or right of the div(but how?).

Any hint in this direction would be good enough. Here is basic html http://jsfiddle.net/illumine/jfknz/

<div id="editor" contenteditable='true'>
  If user types in this area it should fire an event if the end of line reached while typing i.e. when cursor switches the line.

  <br/>

  Also an event should fire when cursor has reached end of the div. i.e. when content overflows the div.
</div>
ʞɹᴉʞ ǝʌɐp
  • 5,350
  • 8
  • 39
  • 65
  • This will be non-trivial to get right. – Tim Down Oct 11 '13 at 14:44
  • And what if text inside of DIV has different styles (font-size,s spacing, padding etc.) – Yuriy Galanter Oct 11 '13 at 15:03
  • @YuriyGalanter Yes that is the case, essentially contenteditable div is a rich text editor which will have different type of font-size and styling etc. However div's width and height is fixed all the time. So I am wondering if this can be utilized somehow. Something in line of cursor position or offset but I can't get the thought process right. – ʞɹᴉʞ ǝʌɐp Oct 11 '13 at 15:09
  • 1
    Try searching https://www.google.com/search?q=javascript+detect+text+cursor+coordinates+in+pixels perhaps not exact answers, but should give you some ideas – Yuriy Galanter Oct 11 '13 at 15:40
  • @YuriyGalanter Yes :), I am already looking at http://stackoverflow.com/questions/16212871/get-the-offset-position-of-the-caret-in-a-textarea-in-pixels I ll post here If I succeed. – ʞɹᴉʞ ǝʌɐp Oct 11 '13 at 15:45

0 Answers0