Chrome/jQuery Uncaught RangeError:超过最大调用堆栈大小

Chrome/jQuery Uncaught RangeError: Maximum call stack size exceeded

本文关键字：调用 堆栈 jQuery Uncaught RangeError Chrome      更新时间：2023-09-26

我得到错误"未捕获的RangeError:最大调用堆栈大小超过"在chrome上。这是我的jQuery函数

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

注意页面中有成千上万个单元格。然而，我通常将堆栈溢出与递归联系起来，在这种情况下，据我所知没有。

像这样创建一个lambda会自动在堆栈上生成一堆东西吗?有别的办法吗?

目前，我唯一的解决办法是在渲染HTML时显式地在每个单元格上生成onclick事件，这使得HTML更大。

由于"页面中有成千上万个单元格"，将click-event绑定到每个单元格将导致严重的性能问题。有一个更好的方法，那就是将点击事件绑定到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"标签执行任务。我想你会对这篇关于事件绑定的文章感兴趣的。委托

或者你可以简单地使用jQuery的".on()"方法，效果相同:

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

在无限循环时也会出现此错误。请确保没有任何不结束的递归self引用。

我的更多的是一个错误，发生的是循环点击(我猜)基本上是通过点击登录，父级也被点击，最终导致最大调用堆栈大小超过。

$('.clickhere').click(function(){
   $('.login').click();
});
<li class="clickhere">
  <a href="#" class="login">login</a>
</li>

这个问题发生在我使用jQUery Fancybox与许多其他jQUery插件的网站。当我使用LightBox(网站在这里)而不是Fancybox，问题就解决了。

你可以使用

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

我最近也遇到了这个问题。我在对话框div中有一个非常大的表，它大于15,000行。当.empty()在对话框div上被调用时，我得到了上面的错误。

我找到了一个迂回的解决方案，在我调用清理对话框之前，我将从非常大的表中删除每隔一行，然后调用。empty()。不过，这似乎奏效了。看来我的旧版本的JQuery不能处理这么大的元素

我得到这个错误，因为我的错误，我忘记声明一个变量，这是在Ajax数据传递。只有模式被首先声明。

data: {
     tmp_id: tmp_id,
     mode: mode
}

也声明了tmp_id变量，它工作得很好。

let tmp_id=$("#tmp_id").val();
let mode=$("#mode").val();
$.ajax({
    url: 'my-url',
    method: 'post',
    data: {
     tmp_id: tmp_id,
     mode: mode
    }
    dataType: 'json',
    success: function(response) {
       console.log(response);
    }
    });
 }

   In My case I was html element insted of value
                          |
                          |
   var uname=$("#uname");<-
    
   let data={
     uid:uid,
     .....
   };        
    
   $.post("url",data,(responseText)=>{ 
       ..
   }).fail((xhr)=>{
       ..
   });
    
  then I updated 
                              |
                              |
  var uname=$("#uname").val()<-

确保在未获取值的情况下访问元素。由于省略了val()函数，我已经能够很容易地报告这个问题。

例如:

$.ajax({
    url : '/url-test',
    type : 'GET',
    data : {
        'country':$("#test_input_field")
    }
应该

$.ajax({
    url : '/url-test',
    type : 'GET',
    data : {
        'country':$("#country__c").val()
    }

对于我来说，当我应该引用$('#inputfield')**.val();时，我试图引用$('#inputfield')

相关文章：