Breaking News: Grepper is joining You.com. Read the official announcement!

onchange for contenteditable div

coder_king answered on October 14, 2020 Popularity 9/10 Helpfulness 5/10

answer onchange for contenteditable div

related div contenteditable onchange angular

onchange for contenteditable div

Comment

<div id="editor" contenteditable>
      Text inside div
</div>
<script type="text/javascript">
  document.getElementById("editor").addEventListener("input", 
  	(e) => console.log(e.currentTarget.textContent), false);
</script>

Popularity 9/10 Helpfulness 5/10 Language html

Source: Grepper

Tags: contenteditable html onchange

Link to this answer
Share Copy Link

Contributed on May 30 2022

coder_king

0 Answers Avg Quality 2/10

Closely Related Answers

div contenteditable onchange angular

Comment

You can use the input event, like so:
...
<div contenteditable (input)="onNameChange($event.target.innerHTML)">
   Type your name
</div>

Popularity 8/10 Helpfulness 8/10 Language html

Source: stackoverflow.com

Tags: angular contenteditable contente

Link to this answer
Share Copy Link

Contributed on Apr 09 2021

GutoTrosla

0 Answers Avg Quality 2/10

contenteditable onchange

Comment

<!-- 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>

Popularity 9/10 Helpfulness 7/10 Language html

Source: Grepper

Tags: contenteditable

Link to this answer
Share Copy Link

Contributed on Oct 14 2020

Arrogant Ape

0 Answers Avg Quality 2/10

contenteditable onchange

Comment

<!-- 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>

Popularity 1/10 Helpfulness 1/10 Language html

Source: Grepper

Tags: contenteditable html onchange

Link to this answer
Share Copy Link

Contributed on Jan 26 2022

Agreeable Antelope

0 Answers Avg Quality 2/10

onchange for contenteditable div

Contents

More Related Answers

onchange for contenteditable div

Closely Related Answers

div contenteditable onchange angular

contenteditable onchange

contenteditable onchange

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.