代码之家  ›  专栏  ›  技术社区  ›  Rayfloyd

ajax调用后Fancybox未关闭

  •  2
  • Rayfloyd  · 技术社区  · 13 年前

    在某些情况下,在ajax调用后,我很难关闭我的花式框。

     $(document).ajaxStop(function() {
        function(){$.fancybox.close()};
     });
    
     $(document).ajaxStart(function() {
        $("a#load_gif").trigger('click');
     });
    

    这是我处理花式盒子的代码。因此,我的问题是,如果ajax调用非常简短和快速,盒子就不会关闭,但如果调用时间更长,它会自动关闭。

    我找到了一个解决办法

    $(document).ajaxStop(function() {
        setTimeout(function(){$.fancybox.close()},500);
    });
    

    但老实说,这个解决方案并不好看。即使ajax调用返回得很快,我该怎么做才能关闭花哨的盒子?ajax调用的长度是可变的,这取决于它必须获取的行数。

    欢迎提供任何帮助和/或建议。

    1 回复  |  直到 13 年前
        1
  •  2
  •   invertedSpear    13 年前

    当AJAX调用试图启动关闭函数时,你似乎有一个竞争条件,也许fancybox还没有完成创建,也没有定义它的关闭函数。

    我建议采用两步流程,以触发fancybox关闭。创建2个全局变量 ajaxStop = false; fancyboxDone = false;

    创建一个函数,如:

    function closeFancyBox(){
        if(ajaxStop && fancyboxDone){
            $.fancybox.close();
            ajaxStop = fancyboxDone = false;
        }
    }
    

    然后将ajax停止更改为:

     $(document).ajaxStop(function() {
        function(){
          ajaxStop = true;
          closeFancyBox()
        };
     });
    

    最后,在您的fancybox中添加一个onComplete函数,该函数的作用与ajax Stop相同,但设置 fancyboxDone = true 而不是 ajaxStop .

    因此,现在无论哪一个获得第一名和第二名,他们都可以检查彼此的状态,并适当地结束比赛。