爲內容添加不同的號碼

因此，我想獲取約6000個配置文件的信息，每個配置文件都有自己的鏈接，其編號從1-6000開始。我想從一個頁面中獲取每個配置文件的特定圖像。這裏是代碼，以獲得用戶1的個人資料...它說u1它需要用每個不同的數字代替1。爲內容添加不同的號碼

<span id="boutiqueimage"></span> 
<script>$('#boutiqueimage').load('/u1 #field_id14 dd') 
             </script>

來源

2014-10-03 Leandra Katelyn

好了，你可以得到* *通過調用'.load（）'在一個循環中的圖像。但是使用當前的設置會導致每個響應覆蓋目標元素中的前一個響應。你想用6000張圖片做什麼？將它們全部添加到該元素？他們的命令是否重要？ – David 2014-10-03 19:58:16

@大衛有些人可能甚至沒有圖像和其他人會，我基本上想要讓他們，讓我可以顯示他們所有人，並通過不同的用戶圖像看，讓別人也看到它。你能否告訴我一個更好的方法讓他們像你說的一樣循環？ – 2014-10-03 20:33:17

@mplungjan某些配置文件ID對幫助描述不是很明確嗎？ – 2014-10-03 20:37:00

乍一看這似乎是一個簡單的循環會做的伎倆，但問題不一定取圖像但他們做什麼，當你得到他們。爲此，您不想使用，因爲它只是在您的用例之外。（它假定你要設置的獲取內容的元素，但你要追加所獲取的內容的元素。）

爲了做到這一點，我們需要執行幾乎相同的功能，讓我們見how it does its thing。看起來它只是.ajax()標準調用這個作爲它的成功處理程序：

self.html(selector ? 
      jQuery("<div>").append(jQuery.parseHTML(responseText)).find(selector) : 
      responseText);

似乎很簡單。我們可以多一點簡化它，因爲我們知道我們有一個selector值：

$('#boutiqueimage').append(jQuery('<div>').append(jQuery.parseHTML(responseText)).find(selector));

我們：

self.html(jQuery('<div>').append(jQuery.parseHTML(responseText)).find(selector));

現在不是在self調用.html()，我們我們的目標元素調用append()需要明確定義selector：

$('#boutiqueimage').append(jQuery('<div>').append(jQuery.parseHTML(responseText)).find('#field_id14 dd'));

現在我們可以換，在AJAX調用：

jQuery.ajax({ 
    url: '/u1', 
    type: 'GET', 
    dataType: 'html' 
}).done(function(responseText) { 
    $('#boutiqueimage').append(jQuery('<div>').append(jQuery.parseHTML(responseText)).find('#field_id14 dd')); 
});

這應該爲我們的需要複製的功能。現在我們可以把它在一個循環：

for (var i = 1; i <= 6000; i++) { 
    jQuery.ajax({ 
     url: '/u' + i, 
     type: 'GET', 
     dataType: 'html' 
    }).done(function(responseText) { 
     $('#boutiqueimage').append(jQuery('<div>').append(jQuery.parseHTML(responseText)).find('#field_id14 dd')); 
    }); 
}

這應該使6000個AJAX請求每個的url是i從循環不同的值。請記住，有沒有保證響應將按照它們的請求順序進行。所以這是非常不太可能產生的圖像將被排序從1-6000。

編輯：在迴應評論時，或許以串行而不是並行運行請求會有所幫助。讓我們將操作封裝到一個函數中，並從它自己的成功處理函數中調用它。也許是這樣的：

function fetchImage(id) { 
    jQuery.ajax({ 
     url: '/u' + id, 
     type: 'GET', 
     dataType: 'html' 
    }).done(function(responseText) { 
     $('#boutiqueimage').append(jQuery('<div>').append(jQuery.parseHTML(responseText)).find('#field_id14 dd')); 
     if (id < 6000) { 
      fetchImage(id + 1); 
     } 
    }); 
} 
fetchImage(1);

這會加載他們慢很多，因爲它一次只有一個。但我猜6000首同時請求並不是一個好主意:)這也會順序加載它們，這是一個獎勵。

來源

2014-10-03 21:39:56 David

好吧，它似乎是做什麼，當我打開控制檯我收到這個錯誤信息很多無法加載資源：服務器響應與狀態503（服務暫時不可用）和一些未捕獲的TypeError：undefined不是一個函數我知道有些人可能沒有圖像，但想顯示這兩個代碼的幫助？ – 2014-10-03 23:36:15

這是非常糟糕的建議在循環中獲取6000圖像。取而代之的是在成功收到每張圖片時執行下一次獲取。 – mplungjan 2014-10-04 06:16:05

@LeandraKatelyn：我已經用修改過的方法更新了答案，可能值得一試。 – David 2014-10-04 13:28:16

假設您發佈的代碼適用於配置文件1，並且配置文件的編號從1到6000，並且您不需要分頁，那麼試試這個。注意：訪問片段會導致下載整個頁面！更好的解決方案是設置一個僅返回必要的html的服務器進程。

var max = 6000,cnt=1; 
function loadNext() { 
    $("#container").append('<span id="boutiqueimage'+cnt+'"></span>'); // add a span 
    $('#boutiqueimage'+cnt).load('/u'+cnt+' #field_id14 dd', 
    function (responseText, textStatus, req) { // if error 
     if (textStatus == "error") { 
     $('#boutiqueimage'+cnt).html("image "+cnt+" not found"); 
     } 
     else { 
     if (cnt<max) { 
      cnt++; 
      loadNext(); 
     } 
     } 
    }); 
} 

$(function() { 
    loadNext(); //start 
});

使用

<div id="container"></div>

來源

2014-10-04 06:40:52 mplungjan

爲內容添加不同的號碼

回答

相關問題