Question

I’ve successfully implemented a bit of code that strips all HTML from a pasted string using stripTags(). My next goal is to mark a few tags with white flags so they get ignored on ‘paste’ event using .wrap() to augment the function.

I’m using prototype.js as a framework and have slowly been working through the growing pains of learning both the framework and javascript, but this issue has presented a bit of a roadblock.

I’ve googled around a bit and found what looks like two great solutions, but I don’t seem to be implementing them correctly.
Found solutions:
http://perfectionkills.com/wrap-it-up/ (function to indicate tags to remove)
and
http://pastebin.com/xbymCFi9 (function to allow tags to keep)

I pretty much copied and pasted from the latter.
If I pull the ‘br’ from the code, then the regex is ignored and all html is stripped. If I leave it, nothing gets pasted.

Here is what I’ve pieced together (and I feel silly for not being able to figure this out!).

String.prototype.stripTags = String.prototype.stripTags.wrap( 
    function(proceed, allowTags) { 
            if (allowTags) {
            if (Object.isString(allowTags)) allowTags = $w(allowTags)
            this.gsub(/(<\/?\s*)([^\s>]+)(\s[^>]*)?>/, function(match) {
                if (allowTags.include(match[2].toLowerCase()))
            return match[1] + match[2] + match[3] + '>'
        })
        } else {
        // proceed using the original function
        return proceed(); 
    }
  });


 WysiHat.Commands.promptLinkSelection = function() {
  if (this.linkSelected()) {
    if (confirm("Remove link?"))
      this.unlinkSelection();
  } else {
    var value = prompt("Enter a URL", "http://www.alltrips.com/");
    if (value)
      this.linkSelection(value);
  }
}

document.on("dom:loaded", function() {
  var editor = WysiHat.Editor.attach('event_desc');
  var toolbar = new WysiHat.Toolbar(editor);

  editor.observe("paste", function(event) {
    var el = $(this);
    setTimeout(function() {
        var pText = el.innerHTML.stripTags('br');
        //alert(pText);
        $('event_desc_editor').update(pText);
        $('event_desc').setValue(pText);
     }, 0);
});

(You may recognize the WysiHat code from 37Signals text editor)

note: you can see the alert commented out. If I do alert the ptext, I get ‘undefined’ returned.

Answer 1

So I’ve given up on and moved to a regex solution:

el.innerHTML.replace(/<(?!\s*\/?\s*p\b)[^>]*>/gi,'')