在ajax調用后為jquery每個函數添加延遲
[英]Add a delay to jquery each function after an ajax call
問題描述
我有一個XML文檔（如下）：
<?xml version="1.0" encoding="UTF-8"?>
<testimonials>
<testimonial user="User Name 1" state="1" comment="Comment 1"></testimonial>
<testimonial user="User Name 2" state="2" comment="Comment 2"></testimonial>
<testimonial user="User Name 3" state="3" comment="Comment 3"></testimonial>
<testimonial user="User Name 4" state="4" comment="Comment 4"></testimonial>
<testimonial user="User Name 5" state="5" comment="Comment 5"></testimonial>
</testimonials>
我正在通過jQuery ajax調用獲取此數據。 現在，我想在一個框（#xmlFeed）中顯示它，然后淡入和淡出到下一個節點。 假設它顯示了幾秒鍾，然后再移動到下一個節點，再次淡入和淡出。
到目前為止，我的代碼在下面可以正常工作，但是我無法正常循環播放和漸入漸出。 代碼如下：
<!doctype html>
<html>
<head>
<title></title>
</head>
<body>
<div id="container">
<div id="xmlFeed"></div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script>
$(function(){
//Initial load
getXML();
});
getXML = function(){
$.ajax({
type: "GET",
url: "xml/xmlFeed.xml",
dataType: "xml",
success: function(xml){
var data = $( xml );
var findTestis = data.find("testimonial");
findTestis.each(function(i){
name = this.getAttribute("user");
state = this.getAttribute("state");
comment = this.getAttribute("comment");
contents = " <div id='listing" + i + "'>"
+ "<p><strong>" + comment + "</strong></p>"
+ "<p>" + name + ", " + state + "</p>"
+ "</div>";
setTimeout(function(){
$("#xmlFeed").html(contents);
}, 2000 * i );
});
}
});
}
</script>
</body>
當前，它正在工作並進行顯示，但是它只是一遍又一遍地顯示最后一個節點的內容。 我猜我需要更新增量或類似的東西。 將此視為RSS sytle功能。
感謝您的幫助，請舉例。
4 個解決方案
解決方案1
0 2011-10-13 02:22:20
您每個函數中的“ i”可能是指鍵而不是索引。 由於您的對象是節點，因此可能會將其視為地圖。 在那種情況下，您的超時“ 2000 * i”將不會產生數值（或0），這就是為什么您的最后一個節點將始終顯示-它們都在同一時間但按順序執行的原因。
參見示例： http ： //jsfiddle.net/nVdhf/2/
並在兩個數組和地圖示例中看到差異http://api.jquery.com/jQuery.each/
解決方案2
0 2011-10-13 02:25:21
您的問題是，在繼續下一個超時之前，您沒有等待第一次超時。 您需要以某種方式轉到setTimeout方法的回調中的下一個。
解決方案3
0 2011-10-13 14:04:50
我懷疑這是怎么回事：
- 您遍歷xml數據的內容，為每個節點建立內容字符串。 在外部可能要花費幾百毫秒。
- 在您的超時執行時，
contents已設置為最后一個節點的值，而$('#xmlFeed').html一直保持設置為該值。
類似於http://jsfiddle.net/cori/PrVRc/1/的東西，是我認為您要嘗試做的事情的概念證明（僅經過輕微測試）。
解決方案4
-1 已采納 2011-10-14 00:14:25
我自己弄清楚了，並制作了一個自定義插件啟動。 感謝您提供的所有幫助，但給出的所有答案均無關緊要。 科里，您離商標最近，但仍然不盡如人意。 干杯。
jQuery每個函數在Ajax調用后均無法正常工作
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.