Question

我几个小时以来一直在努力解决一个简单的问题。我写了一个REGEX表达式，但是我希望有一个更优雅的方法来处理HTML。字符串将传递给函数，而不是直接在页面中处理内容。看了很多例子之后我觉得我一定做错了。我想在将数据库保存到数据库之前先取一个字符串并清理客户端事件，我认为jQuery对此非常适合。

我想要：

Some random text <a href="http://stackoverflow.com" onclick="return evilScripts();">click here</a> and a link with any event type
//to become:
Some random text <a href="http://stackoverflow.com">click here</a> and a link with any event type

这是我的代码

function RemoveEvilScripts(){
    var myDiv = $('<div>').html('testing this <a href="#Foo" onclick="return runMyFunction();">Do it!</a> out');
    //remove all the different types of events
    $(myDiv).find('a').unbind();            
    return $(myDiv).html();
}

我的结果是，onClick仍然在锚标记中。

Answer 1

这是一个纯Javascript解决方案，它从以“on”开头的任何DOM元素（及其子元素）中删除任何属性：

function cleanHandlers(el) {

    // only do DOM elements
    if (!('tagName' in el)) return;

    // attributes is a live node map, so don't increment
    // the counter when removing the current node
    var a = el.attributes;
    for (var i = 0; i < a.length; ) {
        if (a[i].name.match(/^on/i)) {
            el.removeAttribute(a[i].name);
        } else {
            ++i;
        }
    }

    // recursively test the children
    var child = el.firstChild;
    while (child) {
        cleanHandlers(child);
        child = child.nextSibling;
    }
}

cleanHandlers(document.body);

http://jsfiddle.net/alnitak/dqV5k/

的工作演示

Answer 2

unbind()不起作用，因为您使用的是内联onclick事件处理程序。如果您使用jquery / javascript绑定了click事件，则可以使用unbind（）取消绑定事件。要删除任何内联事件，您只需使用removeAttr('onclick')

即可

$('a').click(function(){ //<-- bound using script
    alert('clicked');
    $('a').unbind(); //<-- will unbind all events that aren't inline on all anchors once one link is clicked
});

http://jsfiddle.net/LZgjF/1/

Answer 3

我最终得到了这个解决方案，它删除了任何项目上的所有事件。

function RemoveEvilScripts(){
    var myDiv = $('<div>').html('testing this <a href="#Foo" onclick="return runMyFunction();">Do it!</a> out');
    //remove all the different types of events
     $(myDiv)
        .find('*')
        .removeAttr('onload')
        .removeAttr('onunload')
        .removeAttr('onblur')
        .removeAttr('onchange')
        .removeAttr('onfocus')
        .removeAttr('onreset')
        .removeAttr('onselect')
        .removeAttr('onsubmit')
        .removeAttr('onabort')
        .removeAttr('onkeydown')
        .removeAttr('onkeypress')
        .removeAttr('onkeyup')
        .removeAttr('onclick')
        .removeAttr('ondblclick')
        .removeAttr('onmousedown')
        .removeAttr('onmousemove')
        .removeAttr('onmouseout')
        .removeAttr('onmouseover')
        .removeAttr('onmouseup');
    return $(myDiv).html();
}

如何使用jQuery从HTML字符串中的锚点中删除所有ClientEvent

3 个答案: