[解決済み] Chrome/jQuery Uncaught RangeError: 最大呼び出しスタックサイズを超えた

質問

エラー "Uncaught RangeError が発生します。クロームでは、最大呼び出しスタックサイズを超えました"というエラーが表示されます。

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

ページ内のセルは何万個もあることに注意してください。しかし、私は一般的にスタックオーバーフローを再帰に関連付けるが、この場合、私が見る限りでは何もない。

このようなラムダを作成すると、自動的にスタックに負荷がかかるのでしょうか。

今のところ、私が持っている唯一の回避策は、HTMLをレンダリングするときに各セルで明示的にonclickイベントを生成することですが、これはHTMLをはるかに大きくします。

解決方法は？

ページには何万ものセルが存在するため、すべてのセルにクリックイベントをバインドすると、パフォーマンスが極端に低下します。そこで、body &にクリックイベントをバインドし、そのセル要素がクリックのターゲットであったかどうかを調べるという、より良いやり方があります。このように。

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

この方法は、ネイティブの "td" タグだけでなく、後から追加した "td" タグでもタスクを実行します。については、こちらの記事が参考になると思います。 イベントバインディング & デリゲート

または、単純に " を使用することもできます。 .on() jQueryの"メソッドでも同じ効果が得られます。

$('body').on('click', 'td', function(){
        ...
});