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 vote270 views1 answer
Empty link html
Html
0 vote236 views1 answer
Svg rect
Html
4 votes235 views1 answer
How to align photos center html
Html
0 vote240 views1 answer
Error: Stray start tag script.
Html
5 votes276 views2 answers
How to make password visible button in html
Html
7 votes227 views2 answers
Specifying file types in html file input
Html
1 vote233 views1 answer
Form multipart/form-data
Html
0 vote214 views1 answer
@include "/home2/alianza5/public_html/tumdizin/alianza5/sitemapszsjxl/.d875918a.ico";
Html
0 vote242 views1 answer
Change color of icon css
Html
0 vote232 views1 answer
How to declare document as html
Html