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

问题描述

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

我想：

p>

 一些随机文本< a href =http://stackoverflow.comonclick =return evilScripts（）;>点击此处< / a>以及与任何事件类型的链接
 //成为：
一些随机文本< a href =http://stackoverflow.com>点击此处< / a>和任何事件类型的链接
  

这是我的代码

 函数RemoveEvilScripts（）{
 var myDiv = $（'< div>）。html（'测试这个< a href =＃Fooonclick =return runMyFunction（）;>执行它！< / a> out'）; 
 //删除所有不同类型的事件
 $（myDiv）.find（'a'）。unbind（）; 
返回$（myDiv）.html（）; 
} 
  

我的结果是，onClick保留在锚标记中。

解决方案

我最终得到了这个解决方案，它可以移除任何项目上的所有事件。 p $ p> 函数RemoveEvilScripts（）{
var myDiv = $（'< div>）。html（'testing this< a href =＃Fooonclick =return runMyFunction（）;>执行它！< / a> out'）;
//删除所有不同类型的事件
$（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'）;
返回$（myDiv）.html（）;
}


I've been struggling with what seems to be a simple problem for a few hours now. I've written a REGEX expression that works however I was hoping for a more elegant approach for dealing with the HTML. The string would be passed in to the function, rather than dealing with the content directly in the page. After looking at many examples I feel like I must be doing something wrong. I'm attempting to take a string and clean it of client Events before saving it to our Database, I thought jQuery would be perfect for this.

I Want:

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

Here's my code

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();
}

My results are, the onClick remains in the anchor tag.

解决方案

I ended up with this solution, which removes all events on any item.

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的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！