3

我有以下 jQuery 代码:

var id_atual
var temp_id
var tempo_flash = 50
var $slide_atual = $('#slider .atual')
var $slide_prox = $('#slider .ocultar')
setInterval(function(){
    id_atual = $slide_atual.attr('alt')
    $.post('get_banner.php', {atual: id_atual}, function(proximo){
        temp_id = proximo.split(';;')
        $slide_prox.attr('src', temp_id[0]).load(function(){
            $slide_atual.hide('fade', tempo_flash, function(){
                $slide_atual.attr('alt', temp_id[1]).attr('src', temp_id[0]).load(function(){
                    $slide_atual.show('fade', tempo_flash)
                })
            })
        })
    })
}, 4000)

以及以下 HTML 代码:

<div id="slider">
    <img src="imagens/slider/imagen-slider.jpg" alt="1" class="atual"/>
    <img src="" alt="" class="ocultar" />
</div>

.ocultar 类有一个

display: none;

vars tempo_flash 只是动画时间,文件 get_banner.php 只是为了从 mysql 数据库中获取下一个横幅。它经过测试并且工作正常。我遇到的问题是,经过一点点(4 或 5 个横幅更改)后,浏览器停止响应(对于 Firefox Chrome 和 Opera),在 IE 上我收到警报Stack overflow at line: 3,整个页面的 javascript 停止工作。

任何帮助表示赞赏!

4

2 回答 2

3

在 setInterval()ed 函数的每次迭代中,您将.load()事件分配给图像占位符。将事件分配给对象不会删除现有事件!

所以在第二次迭代中,图像占位符将有两个.load()事件处理程序,然后是三个,依此类推;并且每次加载图像时,它都会触发附加到.load()事件的所有事件处理程序。您可能需要重构您的代码,可能.load()只分配一次事件处理程序(并使用分号)。

于 2012-04-10T14:47:16.040 回答
0

你不应该使用 setInterval,你应该在函数中使用 setTimeout,并在 $.post 的回调中执行它,例如:

var id_atual
var temp_id
var tempo_flash = 50
var $slide_atual = $('#slider .atual')
var $slide_prox = $('#slider .ocultar')
function tictac(){
    setTimeout(function(){
        id_atual = $slide_atual.attr('alt')
        $.post('get_banner.php', {atual: id_atual}, function(proximo){
            temp_id = proximo.split(';;')
            $slide_prox.attr('src', temp_id[0]).load(function(){
                $slide_atual.hide('fade', tempo_flash, function(){
                    $slide_atual.attr('alt', temp_id[1]).attr('src', temp_id[0]).load(function(){
                        $slide_atual.show('fade', tempo_flash)
                    })
                })
            })
        })
        ticktac();
    }, 4000);
}

这样,只有在服务器响应完成时才开始计算 4 秒,不会出现溢出问题

于 2012-04-10T14:11:19.167 回答