Question

I have users copying content from random webpages and pasting into a SharePoint 2010 RTE. Unbeknownst to them, they are also copying styles from the original webpages that the RTE converts to styled span tags and those span tags are overriding the default text styling on the page. Upon paste, I’d like to automatically remove any/all span tags but keep any remaining markup. I realize that there will be other related issues but removing the span tags will get me much closer to where I need to be.

I’ve found a code snippet here that removes all markup upon paste.

//Disable the RTE paste option. Restricts to "Paste Plain Text" 
function disableMarkupPasteForRTE()
{
 Type.registerNamespace("RTE");
 if (RTE)
 {
  if(RTE.RichTextEditor != null)
  {
   RTE.RichTextEditor.paste = function() { RTE.Cursor.paste(true); }
   // Handle Ctrl+V short cut options in rich text editor
   RTE.Cursor.$3C_0 = true;
  }
 }
}

_spBodyOnLoadFunctionNames.push("disableMarkupPasteForRTE");

Is anyone able to modify the above code to only remove span tags?

Answer 1

The SharePoint RTE is nothing more than a suped-up ContentEditable div. The solution is to bind a function onpaste to the editor and then manipulate the html directly.

$(document).ready(function() {
    $(".ms-rtestate-write").bind('paste', function(e) {
        var text = $(this).html();
        $(this).html(text.replace( /<\s*span.*?>/gi,"").replace( /<\s*\/\s*span\s*.*?>/gi,""));
    });
});