Contenteditable onchange

<!-- Use an "input" event listener -->
<div contenteditable="true" id="editor">Please type something in here</div>
<script>
  document.getElementById("editor").addEventListener("input", inputEvt => {
    console.log("input event fired");
  }, false);
</script>

Contenteditable onchange

<!-- Using JQuery -->
<!-- Add a data attribute to DIV -->
<div contenteditable="true" id="editor" data-html="">Please type comething in here</div>
<script>
  // DIV onclick store the current div content data attribute
  $('#editor').on('click', () => {
    let item = $(this)
    item.data({html: item.html()})
  })
  // DIV onblur store the current div content data attribute
  $('#editor').on('blur', () => {
    let item = $(this)
    if (item.data('html') !== item.html()) {
        // DIV content was changed
    	// do something here
    }
  })
</script>

Similar codes

1 vote311 views1 answer
How to run html file in xampp server
Html
0 vote330 views1 answer
Sublimelinter-html-tidy for linux
Html
57 votes314 views2 answers
Html button radio button
Html
0 vote342 views1 answer
Prop sent via link has no spaces vuejs
Html
0 vote350 views1 answer
Large text class
Html
0 vote364 views1 answer
Fafa login icons html code
Html
0 vote362 views1 answer
Add background image in html without css
Html
0 vote333 views1 answer
How to send the data through url in html without using the form
Html
0 vote378 views1 answer
Como añadir bootstrap a html
Html
0 vote317 views1 answer
Click button to go to sub pag on html
Html