简体   繁体   English

jQuery cluetip内存泄漏

[英]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: 因此,这里有一些评论:

  • First off, what this script does makes no sense to me... resetting the cluetips and the contents of the page every second. 首先,这个脚本对我来说没有任何意义……每秒重新设置提示和页面内容。 Why not just update the title attribute with new information then refresh the cluetip or set the cluetip attribute ajaxCache: false if you are getting the updates via ajax? 为什么不只是用新信息更新title属性,然后刷新cluetip或设置cluetip属性ajaxCache: false如果要通过ajax获取更新, ajaxCache: false
  • Using .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();
  • Wildcards don't work with IDs this way $('#cluetip*') a better way to do this is to use a selector attribute filter like this $('div[id*="cluetip"]') 通配符不适用于$('#cluetip*')这样的ID,更好的方法是使用选择器属性过滤器,例如$('div[id*="cluetip"]')
  • I couldn't duplicate the memory leak. 我无法复制内存泄漏。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM