如何在不让可怕的“停止运行此脚本？”的情况下清除内容？对话？ [英] How can I clear content without getting the dreaded "stop running this script?" dialog?
问题描述
在Windows窗体中，某些控件上有一个BeginUpdate / EndUpdate对。我想要这样的东西，但是对于jQuery。
In Windows Forms there's a BeginUpdate/EndUpdate pair on some controls. I want something like that, but for jQuery.
我有一个div，它有一个div。像这样：
I have a div, that holds a div. like this:
<div id='reportHolder' class='column'>
<div id='report'> </div>
</div>
在内部div中，我添加一对（7-12）a和div元素对，像这样：
Within the inner div, I add a bunch (7-12) of pairs of a and div elements, like this:
<h4><a>Heading1</a></h4>
<div> ...content here....</div>
内容的总大小可能是200k。每个div只包含一个HTML片段。在其中，有许多< span> 元素，包含其他html元素，并且它们可以嵌套到5-8级深度。没有什么特别的，我不认为。 （更新：使用这个答案，我了解到片段中有139423个元素。）
The total size of the content, is maybe 200k. Each div just contains a fragment of HTML. Within it, there are numerous <span> elements, containing other html elements, and they nest, to maybe 5-8 levels deep. Nothing really extraordinary, I don't think. (UPDATE: using this answer, I learned there were 139423 elements in the fragment.)
添加完所有内容后，
我然后创造一个手风琴。像这样：
After I add all the content, I then create an accordion. like this:
$('#report').accordion({collapsible:true, active:false});
一切正常。
问题是，当我尝试清除或删除报告div时，需要花费很多时间，我会得到3或4个弹出窗口，询问你想停止运行这个脚本吗？
The problem is, when I try to clear or remove the report div, it takes a looooooong time, and I get 3 or 4 popups asking "Do you want to stop running this script?"
我尝试了几种方法：
选项1：
$('#report').accordion('destroy');
$('#report').remove();
$("#reportHolder").html("<div id='report'> </div>");
选项2：
$('#report').accordion('destroy');
$('#report').html('');
$("#reportHolder").html("<div id='report'> </div>");
选项3：
$('#report').accordion('destroy');
$("#reportHolder").html("<div id='report'> </div>");
在评论中得到建议后，我也尝试过：
after getting a suggestion in the comment, I also tried:
选项4：
$('#report').accordion('destroy');
$('#report').empty();
$("#reportHolder").html("<div id='report'> </div>");
无论如何，它都会挂起很久。
No matter what, it hangs for a long while.
对手风琴的调用（'destroy'）似乎不是延迟的根源。这是报告div中的html内容的擦除。
The call to accordion('destroy') seems to not be the source of the delay. It's the erasure of the html content within the report div.
这是jQuery 1.3.2。
This is jQuery 1.3.2.
编辑 - 固定代码拼写错误。
EDIT - fixed code typo.
ps：这种情况发生在FF3.5以及IE8上。
ps: this happens on FF3.5 as well as IE8 .
问题：
-
花了这么长时间？
What is taking so long?
如何更快地删除内容？
附录
我在选项4期间闯入FF中的调试器，我看到的堆栈跟踪是：
I broke into the debugger in FF, during "option 4", and the stacktrace I see is:
data()
trigger()
triggerHandler()
add()
each()
each()
add()
empty()
each()
each()
(?)() // <<-- this is the call to empty()
ResetUi() // <<-- my code
onclick
我不明白为什么add（）在堆栈中。我正在删除内容，而不是添加内容。我担心在remove（all）的上下文中，jQuery做了一些天真的事情。就像它抓取html内容一样，文本替换为删除一个html元素，然后调用.add（）来放回剩下的内容。
I don't understand why add() is in the stack. I am removing content, not adding it. I'm afraid that in the context of the remove (all), jQuery does something naive. Like it grabs the html content, does the text replace to remove one html element, then calls .add() to put back what remains.
有没有办法告诉从dom中删除HTML内容时jQuery不传播事件？
Is there a way to tell jQuery to NOT propagate events when removing HTML content from the dom?
在Windows窗体中，某些控件上有一对BeginUpdate / EndUpdate对。我想要这样的东西，但是对于jQuery。
In Windows Forms there's a BeginUpdate/EndUpdate pair on some controls. I want something like that, but for jQuery.
相关：
jquery：最快的DOM插入？
推荐答案
你应该尝试绕过jQuery并在销毁手风琴后自己清空内容：
You should try bypassing jQuery and empty out the content yourself after destroying the accordion:
$('#report')[0].innerHTML = '';
这会快得多，但可能会导致IE内存泄漏（jQuery很难尝试确保没有引用阻止IE进行垃圾收集，这是移除数据的原因之一。）
This will be much faster, but may cause IE to leak memory (jQuery goes to great pains to try to ensure that there are no references that prevent IE from doing garbage collection, which is part of why it is so slow to remove data).
这篇关于如何在不让可怕的“停止运行此脚本？”的情况下清除内容？对话？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
