Question

$(".induction-group").bind("DOMSubtreeModified", function(event) {
    $(this).trigger("currentPosition", function( page ) {
        number_of_claims = $(this).find(".claim").length;
            element = $(this).find('.induction-claim-counter').first();
            element.html("Example # " + (page+1) + "/" + number_of_claims);
    });
 });

这在chrome中运行正常，但完全冻结了firefox和IE

。诱导组内容

<div class="row claim-depth-<%#= claim.depth - root_claim.depth %>"> 
<div class="claim">
    <div class="claim-id"> <%= claim.id %> </div>   
    <div class="col-xs-1 claim-icon">
        <span class="glyphicon glyphicon-align-justify"></span>
    </div>

    <div class="col-xs-6 claim-text hidden-sm hidden-xs induction-claim-text">
            <div class="induction-background-1"></div>
            <div class="induction-background-2"></div>
            <div class="induction-background-3"></div>
            <div class="prev-claim">
                <span class="glyphicon glyphicon-arrow-left">
            </div>
            <div class="next-claim">
                <span class="glyphicon glyphicon-arrow-right">
            </div>
            <div class="induction-claim-counter"> <-- !!!!!!! -->
            </div>
            <%= claim.text %>   
    </div>
...............

text（）和val（）函数根本不起作用。有任何想法吗？

Answer 1

您可能正在创建竞争条件....因为您正在监视DOM更改的事件处理程序中修改DOM。如果您解释了使用它的原因，也许您可能会有其他选择

阅读MDN Docs

中的红色揭秘者

<强> Be very careful with this event it is easy to cause an infinite loop if you decide to change the DOM inside the event handler.

Answer 2

也许jquerys .append（）？我不是百分百肯定

Jquery html（）函数太慢了

2 个答案: