[英]jQuery cluetip memory leak
I have been tracking down a memory leak in my web app which dynamically removes and adds anchors which have cluetip tooltips attached and I think that I may have narrowed down the problem to the main closure in cluetip which attaches the cluetip to the node (line 32: var link = this, $this = $(this);). 我一直在跟踪我的Web应用程序中的内存泄漏,该内存泄漏会动态删除并添加附加了cluetip工具提示的锚点,我认为我可能已将问题缩小到cluetip中的主关闭(将cluetip连接到节点上)(第32行) :var link = this,$ this = $(this);)。
I have been running the following script in SIEV with a modified version of jquery 1.3.2 with the following fix which allows the cluetip elements to be removed. 我一直在SIEV中运行以下脚本,并使用jquery 1.3.2的修改版,并具有以下修复程序,该命令允许删除cluetip元素。 However, the anchor nodes become orphaned as there is still 1 reference to them after the cluetip nodes are removed? 但是,锚点节点变成孤立的,因为除去线索提示节点后仍然有1个引用指向它们?
If I change line 32 of the cluetip source to the following for testing purposes: var link = $('br'), $this = $('br'); 如果出于测试目的而将cluetip源的第32行更改为以下内容:var link = $('br'),$ this = $('br');
The anchors are freed but the 'br' nodes start building up. 释放了锚,但是“ br”节点开始建立。
Therefore, I was wondering if anyone knows how I can work around this problem? 因此,我想知道是否有人知道我可以如何解决此问题? or if I am simply not releasing the resources correctly? 还是我只是没有正确释放资源?
Attached Scripts and Source: 附带的脚本和来源:
jQuery modification. jQuery修改。 After line 1247 insert the following before the closing curly brace ( http://markmail.org/message/cfi4bvfjc3m6ww6k#query:jquery%20memory%20leak%20in%20remove%20and%20empty+page:1+mid:tapc7zt3cwl6rw4f+state:results ): 在第1247行之后,在右花括号前插入以下内容( http://markmail.org/message/cfi4bvfjc3m6ww6k#query:jquery%20memory%20leak%20in%20remove%20and%20empty+page:1+mid:tapc7zt3cwl6rw4f+state:结果 ):
this.outerHTML = ""; this.outerHTML =“”;
Example Script: 示例脚本:
<html>
<head>
<link rel="stylesheet" type="text/css" href="jquery.cluetip.css"/>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="jquery.cluetip.js"></script>
<script type="text/javascript">
$(document).ready(function() {
setInterval(resetCluetip, 1000);
});
function resetCluetip() {
$('a').each(function() {
$(this).cluetip('destroy');
$(this).unbind().remove();
});
$('#cluetip*').unbind().empty();
$('body').html('<a href="#" class="contextMenu" title="title|body">anchor one</a><br>');
$('a').each(function() {
$(this).cluetip({splitTitle: '|'});
});
}
</script>
</head>
<body>
</body>
</html>
So here are a few comments: 因此,这里有一些评论:
ajaxCache: false
if you are getting the updates via ajax? 为什么不只是用新信息更新title属性,然后刷新cluetip或设置cluetip属性ajaxCache: false
如果要通过ajax获取更新, ajaxCache: false
? .remove()
on an object should remove it from the DOM and also unbind any references, so you shouldn't need to use .unbind().remove();
在对象上使用.remove()
会将其从DOM中删除,并且还取消绑定任何引用,因此您无需使用.unbind().remove();
or .unbind().empty();
或.unbind().empty();
$('#cluetip*')
a better way to do this is to use a selector attribute filter like this $('div[id*="cluetip"]')
通配符不适用于$('#cluetip*')
这样的ID,更好的方法是使用选择器属性过滤器,例如$('div[id*="cluetip"]')
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.