Question

数组slidesArray是二维数组。它充满了2排。问题是，当尝试在jQuery上使用（每个）函数时，它只获得最后一行。

以下是代码：

jQuery.each(slidesArray,function(index,value) {
    $("#slider").show();

    var linkHref = value[1];
    var imageSource = value[0];;

    $("#slider").html(
        "<a href='" + linkHref + "'><img src='"+ imageSource + "'></a>")
        .fadeOut(5000);
});

那么，问题或原因是什么？

Answer 1

纠正这个

 $("#slider").html
            (
                "<a href='" + linkHref + "'><img src='"+ imageSource + "'></a>"
            ).fadeOut(5000);

到

 $("#slider").html
            ($("#slider").html()+
                "<a href='" + linkHref + "'><img src='"+ imageSource + "'></a>"
            ).fadeOut(5000);

Answer 2

$("#slider").append("<a href='" + linkHref + "'><img src='"+ imageSource + "'></a>").fadeOut(5000);

“html”应替换为“append”

Answer 3

您希望将项目添加到$("#slider")淡出它们，然后将其替换为新项目，.html()不等待.fadeOut()，您可以使用.fadeOut()回调以在淡出后替换项目。

function fadeFunc(){
    var i = $("#slider").data('current')+1;
    if (i < slidesArray.length){
        $("#slider").data('current', i);
        var linkHref = slidesArray[i][1];
        var imageSource = slidesArray[i][0];

        $("#slider").html(
            "<a href='" + linkHref + "'><img src='"+ imageSource + "'></a>")
            .fadeOut(5000, fadeFunc);            
    }
} 

$("#slider").data('current', 0)
    .html("<a href='" + slidesArray[0][1] + "'><img src='"+ slidesArray[0][0] + "'></a>")
    .fadeOut(5000, fadeFunc);

仅检索最后一行2维数组

3 个答案: