無限滾動后無法加載外部JS文件的功能

Question

我在tumblr上使用gumroad.js無限滾動

<script type="text/javascript" src="https://gumroad.com/js/gumroad.js"></script>

這將在單擊按鈕時創建一個覆蓋簽出（模式）窗口。 對於前15個帖子，它加載正常。 但是，一旦其余按鈕加載到無限滾動上，它們就不會加載js功能。

腳本位於頁面的<head>

我是否需要在無限滾動的每個回調中重新加載文件？： function(newElements) {

編輯

我只是注意到，在無限滾動之后，soundcloud播放器也消失了。 這些都是自定義類。 它們在檢查器中顯示為類仍然完好無損，但是未處理js文件。

Answer 1

已知無限滾動會導致腳本問題。 是的，您可能需要在每次加載頁面后在回調中重新初始化Gumroad。 我對Gumroad不太了解，但是很快就找到了

Gumroad.init()

作為重新初始化代碼的一種方法。

如果我錯了，有人可以糾正我，但是將這一行放在回調中應該可以！

編輯：

我們不能阻止Gumroad.js在每次運行init()之后創建重復的按鈕，因此我們只需要擦除所有按鈕並讓它們重新初始化即可。 也沒有辦法取消附加點擊處理程序，因此您需要克隆錨點以將其刪除。 在每個無限滾動回調之后，您將需要運行以下代碼以將所有gumroad鏈接設置回正常狀態，然后調用Gumroad.init()重新初始化。 我不確定您是否使用jQuery，但如果是這樣，這是最簡單的方法。

使用他們的演示作為模型：

jQuery的

$('.gumroad-button').each(function() {
    $(this).replaceWith($(this).clone().children().remove().end()); 
});
Gumroad.init();

香草javascript

for (var i = 0, a = document.getElementsByTagName("a"); i < a.length; i++) {
  if (a[i].className.indexOf("gumroad-button") > -1) {
    var clone = a[i].cloneNode();
    clone.appendChild(document.createTextNode(a[i].lastChild.nodeValue));
    a[i].parentNode.replaceChild(clone, a[i]);
  }
}
Gumroad.init();

筆記

選擇要刪除的子元素后，需要.end()來引用克隆的元素
.remove()不會刪除文本節點，因此克隆后（最佳）僅刪除按鈕的“圖標”部分。

如果您使用的是普通javascript，則需要在克隆后復制文本節點（“購買我的產品”）。 但是，而不是使用DOM Node.cloneNode方法（通過將true傳遞給.cloneNode(true)來克隆錨點，然后刪除不必要的子元素（即圖標））來進行深度克隆（也克隆所有子元素）這樣，您可以只淺克隆錨，然后將文本復制過來。

同樣，我們需要克隆並替換定位鏈接元素，以消除重復的單擊處理程序，否則，當您單擊按鈕時，它將實際上執行兩次Gumroad疊加模式。

無限滾動后無法加載外部JS文件的功能

問題描述

1 個解決方案

解決方案1
1 已采納 2014-06-19 06:04:20

無限滾動后無法加載外部JS文件的功能

問題描述

1 個解決方案

解決方案1 1 已采納 2014-06-19 06:04:20

解決方案1
1 已采納 2014-06-19 06:04:20