如何在注入腳本時等待嵌入的ajax調用完成？

-1

這是谷歌Chrome擴展開發。我正在使用內容腳本注入網頁。不過，有些網頁有自己的ajax腳本，可以動態地改變內容。我如何等待這些腳本完成，因爲在完成之前我的腳本無法獲得正確的內容？如何在注入腳本時等待嵌入的ajax調用完成？

例如，

1 - 谷歌搜索結果頁面上，

2 - 我想「文本」追加到每一個搜索結果的項目，它可以通過調用很容易做到的稱號，

$('h3').append("text");

3-後來聽搜索查詢的變化，由

$('input[name="q"]').change(function(eventObj){ 
    console.log("query changed"); 
    // DOESN'T work 
    $('h3').append("text"); 
});

洛杉磯完成st line不起作用可能是，因爲在執行時頁面仍在刷新，$('h3')不可用。在頁面上更改查詢時，Google使用ajax來刷新搜索結果。

所以問題是如何捕捉這個變化和仍然能夠每次成功追加「文本」？

編輯：

嘗試過，並沒有工作，要麼：

$('h3[class="r"]').delay(1000).append("text");

，並使用.delay()是不是真的首選。

編輯：

.delay()根本就不是設計用來解決暫停比UI效果等腳本的執行。一個解決辦法是

$('input[name="q"]').change(function(eventObj) {  
    setTimeout(function() { 
     $('h3[class="r"]').append(" text"); 
    }, 1000); 
});

但正如我之前所說，setTimeout()是連接速度相關的，不好的，因爲我必須手動平衡的等待時間和響應速度（我的劇本）。

雖然這篇文章被低估了天知道爲什麼我仍然會等待一個優雅的答案。

來源

2012-08-31 ShuaiYuan

在該代碼中，您延遲1秒後添加內容。更改訂單。 –

@SkalárWag感謝您指出。編輯。 – ShuaiYuan

也許與jQuery 1.7+（或者用「活」或「代表」舊版本）

$('form').on("change", 'input[name="q"]', function(eventObj){ 
    console.log("query changed"); 
    $('h3').append("text"); 
});

如果form是另一種元素，相應更改。

來源

2012-08-31 10:31:37 DrColossos

感謝您的回覆。但是，自從'更改'事件發生後，網頁使用ajax來刷新其內容，並且'h3'僅在刷新完成後纔可用，所以它不起作用。 – ShuaiYuan

這實際上是一個事件委託，所以無論何時將一個新的input [name =「q」]'添加到'form'，它都會將給定的事件委託給'input [name =「q」]'無論如何自事件處於表單之後，是否爲AJAX。如果表單也是動態添加的，則需要將其附加到其他位置才能使用。檢查http://api.jquery.com/on/部分「直接和委託事件」 – DrColossos

恐怕你還是不明白這個問題。觸發'change（）'不是問題。由於'input [name =「q」]'總是可用的，因此可以直接訪問（並聽取'change（）'），因此您的代碼基本上和後面的2-一樣。在'change（）'被觸發後''h3'不能被訪問，因爲你必須等到內容被構造。 – ShuaiYuan

如何在注入腳本時等待嵌入的ajax調用完成？

回答

相關問題