javascript - Contenteditable - How to remove html tag with selection text - Stack Overflow

admin管理员组

文章数量:1024026

how to remove html tag in contenteditable with selection text

function testdemo() {
//what is next
....
}

Before :

<button onclick="testdemo();">RUN</button>

<div id="test" contenteditable="true">
  <b>Lorem ipsum</b> dolor sit amet, <span style="color:red;">ea ignota verear</span> quaerendum
</div>

After :

<div id="test" contenteditable="true">
  Lorem ipsum dolor sit amet, ea ignota verear quaerendum
</div>

Thank you in advance

how to remove html tag in contenteditable with selection text

function testdemo() {
//what is next
....
}

Before :

<button onclick="testdemo();">RUN</button>

<div id="test" contenteditable="true">
  <b>Lorem ipsum</b> dolor sit amet, <span style="color:red;">ea ignota verear</span> quaerendum
</div>

After :

<div id="test" contenteditable="true">
  Lorem ipsum dolor sit amet, ea ignota verear quaerendum
</div>

Thank you in advance

• javascript
• jquery
• html

Share Improve this question Follow asked Mar 3, 2017 at 16:46 Sisi SajahSisi Sajah 23133 silver badges1212 bronze badges 1

• Please check this fiddle it's not perfect, but it gives some ideas of what you need to know to achieve what you want. – Teemu Commented Mar 3, 2017 at 17:33

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 3

Try this:

JS:

function testdemo() {
   var div = document.getElementById('test');
   div.innerHTML = div.textContent;
}

Jquery:

function testdemo() {
   $('#test').html($('#test').text());
}

jQuery version would be as below:

function testdemo() {
  $("#test").html($("#test").text());
}

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button onclick="testdemo();">RUN</button>

<div id="test" contenteditable="true">
  
</div>

function testdemo() {
   var div = document.getElementById('test');
   div.innerHTML = div.textContent;
}

<button onclick="testdemo();">RUN</button>

<div id="test" contenteditable="true">
  <b>Lorem ipsum</b> dolor sit amet, <span style="color:red;">ea ignota verear</span> quaerendum
</div>

See if this helps.

function testdemo() {
$('#test').html($('#test').text()).text();​
}

how to remove html tag in contenteditable with selection text

function testdemo() {
//what is next
....
}

Before :

<button onclick="testdemo();">RUN</button>

<div id="test" contenteditable="true">
  <b>Lorem ipsum</b> dolor sit amet, <span style="color:red;">ea ignota verear</span> quaerendum
</div>

After :

<div id="test" contenteditable="true">
  Lorem ipsum dolor sit amet, ea ignota verear quaerendum
</div>

Thank you in advance

how to remove html tag in contenteditable with selection text

function testdemo() {
//what is next
....
}

Before :

<button onclick="testdemo();">RUN</button>

<div id="test" contenteditable="true">
  <b>Lorem ipsum</b> dolor sit amet, <span style="color:red;">ea ignota verear</span> quaerendum
</div>

After :

<div id="test" contenteditable="true">
  Lorem ipsum dolor sit amet, ea ignota verear quaerendum
</div>

Thank you in advance

• javascript
• jquery
• html

Share Improve this question Follow asked Mar 3, 2017 at 16:46 Sisi SajahSisi Sajah 23133 silver badges1212 bronze badges 1

• Please check this fiddle it's not perfect, but it gives some ideas of what you need to know to achieve what you want. – Teemu Commented Mar 3, 2017 at 17:33

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 3

Try this:

JS:

function testdemo() {
   var div = document.getElementById('test');
   div.innerHTML = div.textContent;
}

Jquery:

function testdemo() {
   $('#test').html($('#test').text());
}

jQuery version would be as below:

function testdemo() {
  $("#test").html($("#test").text());
}

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button onclick="testdemo();">RUN</button>

<div id="test" contenteditable="true">
  
</div>

function testdemo() {
   var div = document.getElementById('test');
   div.innerHTML = div.textContent;
}

<button onclick="testdemo();">RUN</button>

<div id="test" contenteditable="true">
  <b>Lorem ipsum</b> dolor sit amet, <span style="color:red;">ea ignota verear</span> quaerendum
</div>

See if this helps.

function testdemo() {
$('#test').html($('#test').text()).text();​
}

本文标签： javascriptContenteditableHow to remove html tag with selection textStack Overflow