Search code examples
javascriptjqueryhtmlformattingcontenteditable

Remove formatting from a contentEditable div

I have a contentEditable Div and I want remove any formatting especially for copy and paste text.

Solution

  • Have you tried using innerText?

    ADDED:

    If you want to strip markup from content pasted into the editable div, try the old hack of creating a temporary div -- see example below.

    <!DOCTYPE html>
<html>

<head> 
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  <title>Strip editable div markup</title>

  <script type="text/javascript">
    function strip(html) {
      var tempDiv = document.createElement("DIV");
      tempDiv.innerHTML = html;
      return tempDiv.innerText;
    }
  </script>
</head>

<body>
  <div id="editableDiv" contentEditable="true"></div>
  <input type="button" value="press" onclick="alert(strip(document.getElementById('editableDiv').innerText));" />
</body>

</html>