jQuery - 未捕获RangeError：超出最大调用堆栈大小 [英] jQuery - Uncaught RangeError: Maximum call stack size exceeded

问题描述

以下代码（请参阅这里的小提琴）会引发问题标题中提到的堆栈溢出。我试图让一个盒子阴影在脉冲效果中显示在圆形图像周围。有谁可以指出递归，拜托？我是一个Javascript新手，无法看到它。谢谢。

The following code (see Fiddle here) throws the stack overflow referred to in the question title. I'm trying to get a box shadow to display around a circular image in a pulse effect. Can anyone point out the recursion, please? I'm very much a Javascript novice and can't see it. Thank you.

HTML

<div id="pulseDiv"> 
      <a href="#" id="advisers-css-image">
           <div id="advisersDiv"><img src="http://ubuntuone.com/1djVfYlV62ORxB8gSSA4R4"></div>
      </a>
</div>

CSS

.pulse { box-shadow: 0px 0px 4px 4px #AEA79F; }

Javascript

function fadeIn() {
   $('#pulseDiv').find('div.advisersDiv').delay(400).addClass("pulse");
   fadeOut();
};

function fadeOut() {
   $('#pulseDiv').find('div.advisersDiv').delay(400).removeClass("pulse");
   fadeIn();
};

推荐答案

您的调用是递归调用的，它将函数推送到无限堆栈导致由于递归行为导致最大调用堆栈超出错误。而是尝试使用setTimeout这是一个回调。

Your calls are made recursively which pushes functions on to the stack infinitely that causes max call stack exceeded error due to recursive behavior. Instead try using setTimeout which is a callback.

同样基于你的标记你的选择器是错误的。它应该是 #advisersDiv

Also based on your markup your selector is wrong. it should be #advisersDiv

function fadeIn() {
    $('#pulseDiv').find('div#advisersDiv').delay(400).addClass("pulse");
    setTimeout(fadeOut,1); //<-- Provide any delay here
};

function fadeOut() {
    $('#pulseDiv').find('div#advisersDiv').delay(400).removeClass("pulse");
    setTimeout(fadeIn,1);//<-- Provide any delay here
};
fadeIn();

这篇关于jQuery - 未捕获RangeError：超出最大调用堆栈大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！