Question

我有以下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停止工作。< / p>

任何帮助表示赞赏！

Answer 1

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

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

Answer 2

你不应该使用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秒才开始计数，你不会遇到溢出问题

jQuery $ .post导致浏览器堆栈溢出

2 个答案: