Question

我一直在玩一些jQuery并从文件中加载HTML，并且遇到了麻烦。基本上，我希望页面提取URL参数，加载对应于data.html的文件，其中数据是gallery的参数值，然后将存储在data.html内的HTML注入div slider，然后让NivoSlider（一个Jquery画廊）挂钩到那个画廊。

一切正常 - 找到参数，加载文件，更改HTML（根据firebug）。但画廊只是坐在那里空转，就像它认为没有HTML被改变。

这是我的Jquery：

//With respect to http://www.jquery4u.com/snippets/url-parameters-jquery/
    $.urlParam = function(name){
        var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(window.location.href);
            if (!results) { return 0; }
            return results[1] || 0;     
        }
    $(window).load(function() {
        //Attempt to extract the parameter for gallery.
        var album = $.urlParam('gallery');
        var path = album+ ".html";
        //Is this legit?
        if(album != 0){
            //Kick into loading the gallery.
            $("#slider").load(path);
            //Load the gallery?
            $('#slider').nivoSlider({
                effect: 'fade',
                animSpeed:0,
                directionNav: true
            });
        }else{
            path = "a.html"; //Reset path.
            $("#slider").load(path); //Load.
            //Load gallery
            $('#slider').nivoSlider({
                effect: 'fade',
                animSpeed:0,
                directionNav: true
            });

        }       
    });

HTML文件非常简单：

<img src="a/img1.jpg" alt=""/>
<img src="a/img2.jpg" alt=""/>

我是否需要刷新页面或其他内容？我在localhost Web服务器中执行此操作，因此我知道AJAX请求正常工作，并且firebug确认HTML已正确注入。

有什么想法？提前谢谢！

Answer 1

也许你必须等到ajax请求完成才能设置滑块。

    $("#slider").load(path, function(){
        //Load the gallery?
        $('#slider').nivoSlider({
            effect: 'fade',
            animSpeed:0,
            directionNav: true
        });
     });

jQuery / AJAX HTML注入和Gallery插件

1 个答案: