阿賈克斯加載圖像轉換成「elastislide」旋轉木馬通過這樣的AJAX

Question

加載的圖像：圖像中包含的標籤

$('#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); 
     }; 

Answer 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();  
    }); 
}); 

的想法是t o通過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}); 

     }; 

Answer 2

有你需要修改IMO兩點，

1. var ajaximg = $('#sandbox').children()[k]給你D​​OM元素不是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); 
    };