使用相同ID /類的多個div的Ajax加載內容

我試圖將RSS源加載到滑塊中。滑塊處於循環模式，因此在此模式下，您將獲得無限滾動，並且第一張幻燈片將在最後一張幻燈片之後重複。所以實際上我的RSS幻燈片中有兩張幻燈片。使用相同ID /類的多個div的Ajax加載內容

現在的問題是，內容只加載，如果有一個股利。

我的jQuery加載RSS文件：

 (function($) 
{ 
    $(document).ready(function() 
    { 
     $.ajaxSetup(
     { 
      cache: false, 
      beforeSend: function() { 
       $('#rssblok').show(); 
       $('#loading').show(); 
      }, 
      complete: function() { 
       $('#loading').hide(); 
       $('#rssblok').show(); 
      }, 
      success: function() { 
       $('#loading').hide(); 
       $('#rssblok').show(); 
      } 
     }); 
     var $container = $("#rssblok"); 
     $container.load("/kantivi/kantivi_rss.php"); 
     var refreshId = setInterval(function() 
     { 
      $container.load('/kantivi/kantivi_rss.php'); 
     }, 9000); 
    }); 
})(jQuery);

的kantivi_rss.php文件只是一個RSS裝載機和它呼應的內容。這一切工作

現在，其中進料必須在滑塊內容加載的部分看起來像這樣：

<?php 
$slider .= '<div id="rssblok">'; 
              $slider .= '<img src="/img/loading.GIF" id="loading" alt="loading" style="display:none;" />'; 
              $slider .= '</div>'; 
?>

如果我把滑塊不是在一個循環中，將只有一個

<div id="rssblok">

它工作得很好。但是，在循環模式下，它不會加載RSS內容，因爲有2個幻燈片，其中有<div id="rssblok"> div。

希望問題很清楚，如何解決這個問題？

來源

2014-02-19 Trekdrop

IDS必須是唯一的，使用一個類來代替，而迭代該類 – kero

的元素我有同樣的的想法，並嘗試與課堂..但是它是同樣的問題。 – Trekdrop

您需要循環所有容器和負載應用到每一個：

var $containers = $("#rssblok"); 
for (var i=0, j=$containers.length; i<j; i++){ 
    var $container = $($containers[i]); 
    $container.load("/kantivi/kantivi_rss.php"); 
    var refreshId = setInterval(function(){ 
     $container.load('/kantivi/kantivi_rss.php'); 
    }, 9000); 
}

來源

2014-02-19 16:36:33 StephenRios

感謝您的回覆..我明白了，但它仍然無法正常工作。只在非循環模式下。 – Trekdrop

如果你在調用$（「＃rssblock」）或$（「＃loading」）的任何地方，那麼你可能需要一個for循環。如果您可以創建顯示相同問題的小提琴，我可以爲您創建更具體的解決方案。 – StephenRios

做了一個簡短的版本：http://jsfiddle.net/2PTue/6/ 它應該在兩個div中發佈foo兩次。 – Trekdrop

使用相同ID /類的多個div的Ajax加載內容

回答

相關問題