JQuerywrap(）函数只在第一次循环时正确地将链接包装在图像周围

JQuery wrap() function only correctly wraps links around image first time through a loop

本文关键字：正确地 链接 包装 周围 图像 循环 函数 第一次 JQuerywrap      更新时间：2023-11-03

下面的代码只需循环遍历艺术家列表，为每个项目生成图像和链接。这在循环中第一次起作用，但对于随后的迭代，似乎没有添加图像周围的wrap()链接。我尝试了几种不同的方法，包括将所有代码封装在一个单独的变量中，我得到的最好的方法是生成链接，但实际上并没有封装在thumb类（*）中。我担心客户端的操作不是我的强项，所以我很难理解为什么只有循环的第一次迭代成功地包裹在链接中。

*这是使用动态生成的属性ID并包装它，而不是使用类属性，如下所示。

function showArtists(adata) {
    $("#artists").html("");
    for (var i = 0; i < adata.artists.length; i++) {
        var artist = adata.artists[i];
        var artistSpan = document.createElement("span");
        artistSpan.setAttribute("class", "artistView");
        var artistPic = document.createElement("img");
        artistPic.setAttribute("class","thumb");
        artistPic.setAttribute("src",artistPicture)
        $('.thumb').wrap(function() {return "<a href='#' onclick ='getAlbums(artist)'> </a>"});         
        artistSpan.appendChild(artistPic);
        $("#artists").append(artistSpan);
    }
}

您尝试过使用jQuery.each吗？或者jQuery.map？

http://jsfiddle.net/m4k5o992/2/

    $(document).ready(function(){
    showArtists();
});
function showArtists() {

    var artists = [
      { 
            id : "1",
            artistThumb: "http://placehold.it/350x150",
            name : "Van Gogh"
        },
  {
            id : "2",
            artistThumb: "http://placehold.it/350x150",
            name : "Some Dude"           
        }   
    ]


    $("#artists").html("");

    $.each(artists, function(index, i){
        console.log(index, i);
        $("#artists").append('<li><a href="#" onclick ="getAlbums(' + i.id + ')"> <span class="artistView">'+ i.name +' </span><img class="thumb" src=' +  i.artistThumb + '"/></a></li>');

    });

}
相关文章：