加载Ajax的图像进入’elastislide’旋转木马

通过像这样的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 = $('
'+ajaximg+'
 '); $('#carousel3').append($q); $('#carousel3').elastislide( 'add', $q ); }; 

Answer 1

有两点你需要修改IMO，

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

2. 更改var $q = $('

3. '+ajaximg+'

'); to var $q = $('

4. ').append($(this));

你的代码就是

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

Answer 2

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

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

我的想法是通过ajax将图像加载到#carousel中，因此下面的代码可以在不加载到#sandbox的情况下完成所有操作。 重要的是，在加载文档时调用.elastislide（）函数，因为在

中的图像被追加后。 否则旋转木马不会显示它们。

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