在使用pjax時，在哪裏放置頁面初始化JavaScript？

大部分的時間，我把一些JavaScript代碼$(document).ready做一些初始化的東西在頁面上，如事件綁定等在使用pjax時，在哪裏放置頁面初始化JavaScript？

但現在我想用pjaxhttps://github.com/defunkt/jquery-pjax一些我的網頁。

隨着pjax，因爲只有部分頁面被刷新，$(document).ready不會再次調用。

我可以手動觸發事件pjax:end初始化腳本，但我也想知道是否有應該是一個更好的解決方案。

謝謝。

來源

2012-03-14 larryzhao

我覺得你最好的選擇可能是隻是做你說什麼，你的鉤特定頁面初始化代碼到「pjax：結束」事件。這樣做基本上可以完成與之前所做的相同的工作，並可以針對任何已加載到DOM的html運行。

來源

2012-03-19 13:26:35 Carl

您可以輕鬆地連接現有的所有代碼都在的document.ready和pjax：成功事件，就像這樣：

前：

$(document).ready(function() { 
    // page load stuff 
});

後：

$(document).on('ready pjax:success', function() { 
    // will fire on initial page load, and subsequent PJAX page loads 
});

來源

2012-05-16 07:10:51

感謝這個！ – neersighted 2012-10-01 14:44:09

Loool。喜歡它:) – Zeck 2014-05-22 05:25:30

如果初始化代碼的每一頁不同怎麼辦？ – shreyj 2014-11-10 19:17:51

我已經提出了這個簡潔的解決方案。您首先通過在全球範圍內爲您創造粘合劑命名空間開始：

// Binder for PJAX init functions 

$.fn.bindPJAX = {}; // Create namespace 

function bindPJAX(functionName) { 
    // Check function existence, then call it 
    return $().bindPJAX[functionName] && $().bindPJAX[functionName](); 
}

然後綁定一個回調PJAX點擊：

$(document).ready(function(){ 
    if ($.support.pjax) { 
    $('a[data-pjax]').on('click', function(event) { 

     var container = '#main'; 
     var emptyRoute = 'feed'; // The function that will be called on domain's root 

     // Store current href without domain 
     var link = event.currentTarget.href.replace(/^.*\/\/[^\/]+\//, ''); 
     var target = link === "" ? emptyRoute : link; 

     // Bind href-specific asynchronous initialization 
     $(document).on('ready pjax:success', container, function() { 
     bindPJAX(target); // Call initializers 
     $(document).off('ready pjax:success', container); // Unbind initialization 
     }); 

     // PJAX-load the new content 
     $.pjax.click(event, {container: $(container)}); 

    }) 
    } 
});

當此設置，您可以繼續延長$.fn.bindPJAX對象添加將匹配您的路由名稱的函數。例如，這在全球範圍內，將通過PJAX訪問時http://www.yourdomain.com/admin叫：

$.extend($.fn.bindPJAX, { 
    admin: function(){ 
    // Initialization script for /admin route 
    } 
});

你也應該考慮可行的幹回退時PJAX失敗或不支持，像推出正確的初始化函數首先在JavaScript檢查window.location，也許在你的應用程序的視圖硬編碼頁面加載。

來源

2013-02-18 08:29:45

看起來不錯，我會嘗試它。 – larryzhao 2013-02-18 09:26:26

在使用pjax時，在哪裏放置頁面初始化JavaScript？

回答

相關問題