web-dev-qa-db-ja.com

Chrome / jQuery Uncaught RangeError：最大呼び出しスタックサイズを超えました

Chromeで「Uncaught RangeError：Maximum call stack size exceeded」というエラーが表示されます。ここに私のjQuery関数があります

$('td').click(function () {
        if ($(this).context.id != null && $(this).context.id != '') {
            foo($('#docId').val(), $(this).attr('id'));
        }
        return false;
    });

ページには数万のセルがあることに注意してください。ただし、私は通常、スタックオーバーフローを再帰と関連付けます。この場合、表示できる限りはありません。

このようなラムダを作成すると、スタックに大量の負荷が自動的に生成されますか？それを回避する方法はありますか？

現時点で唯一の回避策は、HTMLをレンダリングするときに各セルで明示的にonclickイベントを生成することです。これにより、HTMLが大きくなります。

javascriptjquerygoogle-chromewebkitstack-overflow
104
Andy

「ページ内に数万のセルがある」クリックイベントをすべてのセルにバインドすると、ひどいパフォーマンスの問題が発生します。これを行うためのより良い方法があります。つまり、クリックイベントをボディにバインドしてから、セル要素がクリックのターゲットであったかどうかを確認します。このような：

$('body').click(function(e){
       var Elem = e.target;
       if (Elem.nodeName=='td'){
           //.... your business goes here....
           // remember to replace $(this) with $(Elem)
       }
})

このメソッドは、ネイティブの「td」タグだけでなく、後に「td」を追加してタスクを実行します。 イベントバインディングとデリゲート に関するこの記事に興味があると思います

または、jQueryの「 。on（） 」メソッドを使用して同じ効果を得ることができます。

$('body').on('click', 'td', function(){
        ...
});
126
vantrung -cuncon

無限ループがある場合にもこのエラーが発生する可能性があります。終わりのない再帰的な自己参照がないことを確認してください。

34
John Durden

私はもっ​​とミスで、ループクリック（推測）が発生しました。基本的には、親をクリックしたログインをクリックしても、最大コールスタックサイズを超えてしまいました。

$('.clickhere').click(function(){
   $('.login').click();
});

<li class="clickhere">
  <a href="#" class="login">login</a>
</li>
5
Jsonras

この問題は、他の多くのjQueryプラグインを備えたWebサイト内でjQUery Fancyboxを使用したときに発生しました。 Fancyboxの代わりにLightBox（ site here ）を使用すると、問題はなくなりました。

3
Silvio Delgado

Uは使用できます

  $(document).on('click','p.class',function(e){
   e.preventDefault();
      //Code 
   });
1
demenvil

私も最近この問題に遭遇しました。ダイアログdivに非常に大きなテーブルがありました。 15,000行を超えていました。ダイアログdivで.empty（）が呼び出されたとき、上記のエラーが発生していました。

ダイアログボックスのクリーニングを呼び出す前に、非常に大きなテーブルから1行おきに行を削除してから、.empty（）を呼び出すラウンドアバウトソリューションを見つけました。うまくいったようです。私の古いバージョンのJQueryは、このような大きな要素を処理できないようです。

0
dev4life