1

像这样通过 ajax 加载图像：图像包含在标签中

$('#sandbox').load('./ajax/profile.html li a:eq(1),li a:eq(2),li a:eq(3)').hide();

现在我想将带有标签的图像注入一个名为“elastislide”的轮播中。下面的代码工作，帮帮我！

for (k=0; k<=$('#sandbox').children().length;k++){
            var ajaximg = $('#sandbox').children()[k];
            var $q = $('<li>'+ajaximg+'</li> ');
            $('#carousel3').append($q);
            $('#carousel3').elastislide( 'add', $q );
        };
4

2 回答 2

1

有两点需要修改IMO，

  1. var ajaximg = $('#sandbox').children()[k]给你 DOM 元素而不是你可以使用的 jquery 对象 var ajaximg = $('#sandbox').children().eq(k)；但它更好用$(this)；

  2. 将var 更改$q = $('<li>'+ajaximg+'</li> '); 为var $q = $('<li>').append($(this));

你的代码是

    for (k=0; k<=$('#sandbox').children().length;k++){
        //  var ajaximg = $('#sandbox').children()[k];
        var $q = $('<li>').append($(this));
        $('#carousel3').append($q);
        $('#carousel3').elastislide( 'add', $q );
    };
于 2012-11-19T09:08:33.630 回答
1

上面的代码可以用以下代码更正：

$('#sandbox').load('./ajax/profile.html li a', function(result){
    $(result).find('li a').each(function(){
        var $q = $('<li>').append($(this));
        $('#carousel3').append($q);
        $q.add();       
    });
});

这个想法是通过 ajax 将图像加载到 #carousel 中，因此下面的代码无需先加载到 #sandbox 即可完成所有操作。重要的是，在加载文档时调用 .elastislide() 函数，如下所示，因为那是<li><a><img.../></a></li>在附加图像之后。否则旋转木马不会显示它们。

$('#carousel3').load('./ajax/profile.html li');
        window.onload = initStyle;
        function initStyle() {
            $( '#carousel1' ).elastislide( {minItems : 2} );
            $( '#carousel2' ).elastislide( {minItems : 2} );
            $( '#carousel3' ).elastislide( {minItems : 2} );

        };
于 2012-11-21T16:02:00.807 回答