jQuery深入鏈接Web應用程序

問題...我想要構建一個具有深度鏈接的單頁網絡應用程序（點擊URL以更改用戶所在的位置），以便用戶可以共享鏈接，書籤等。 ..jQuery深入鏈接Web應用程序

與jQuery的燒烤插件的問題是，它需要將href有散在像HREF =「＃/照片/ 1」

這意味着我需要確保每一個URL在我應用程序以散列開頭。而且，這意味着非JS瀏覽器將無法工作，因爲這些URL都是哈希值。

有沒有一種優雅的方式來完成一個深度鏈接的單頁網頁應用程序，它可以無縫工作於JS-&非JS瀏覽器，並且需要更少的代碼更改？

感謝

來源

2010-10-04 AnApprentice

如果你想使用一個單一的URL結構，可以兩個JS和非JS能夠/啓用瀏覽器，你可以檢查瀏覽器是否支持JS並相應地改變導航鏈接。如果瀏覽器確實支持/啓用了JS，則添加一個散列並使用window.location.hash檢索頁面。例如網址：

site.com/#photos/1

如果它不支持JS你的URL看起來像：

site.com/photos/1

這樣，你只需要一個#添加到URL。這很容易做到，無論是在腳本本身中，還是在頁面加載後使用jQuery更改頁面上的鏈接。你可以使用（假設的Apache/PHP）Apache的ModRewrite的URL改寫爲這樣的：

site.com/index.php?p=photos&show=1

說，第一次的網站加載和瀏覽器不支持JS，負載任何應加載正常的方式，取決於（在這種情況下）「頁面」和「顯示」變量。如果它不支持JS，你可以存儲變量是這樣的：

<div style="display:none;" id="page">photos</div> 
<div style="display:none;" id="show">1</div> 
<div id="content"></div>

，並在頁面加載後，你火了jQuery和提取導航數據：

var page = $('#page').html(); 
var show = $('#show').html();

，做任何需要被完成顯示正確的頁面。

當您點擊新鏈接時，您可以使用各種jQuery插件進行哈希導航，或者當沒有JS並且鏈接中沒有哈希時，頁面將以普通方式加載。

爲了防止代碼重複，您需要設置您的頁面，使其可以通過jQuery以正常方式和輕鬆顯示。假設你有這樣的照片頁面，你可以不用JS瀏覽時，包括「photos.php」，用使用相同的文件的jQuery：

$.get(page + '.php', { 
    show: show 
}, function(data) { 
    $('#content').html(data); 
});

由於「photos.php」會看到完全一樣的$_GET變量，輸出將是相同的。

你將雖然得到一些重疊。如果您想顯示/發佈表單，例如你可能會以不同於通過jQuery處理這種情況的正常方式。處理表單數據的正常方式，並顯示更新的頁面。所以在「photos.php」的情況下，你會想要完整的輸出。但是，當使用jQuery時，你只需要一個結果，例如說「完成」並更改頁面而不完全重新加載。這可以通過向$.get（或$.post）函數添加更多變量來解決。

您可能想查看（PHP）MVC框架。當使用MVC設置時，您可以從視圖中分離所有站點的邏輯（導航/數據庫查詢/等）（即站點上顯示的內容）。它使得使用相同的邏輯非常簡單，但單獨使用的意見，在這種情況下，這是一個正常的站點，一個使用基於jQuery的導航。

最後，你必須問自己是否值得去經歷所有這些麻煩。這個網站是誰的？這些人真的使用沒有JavaScript的瀏覽器嗎？是否真的有必要建立一個不依賴JS的網站？現在大多數人都在使用可以處理JS的瀏覽器，而且人們爲了'安全原因'而禁用它的時間早已消失。維護一個站點的兩個版本可能會佔用大量時間和資源（取決於當然的大小），所以它可能不值得。在這種情況下，簡單地顯示一條消息或一個精簡而簡化的網站會更容易，他們表示用戶應該踏入21世紀才能使用功能齊全的網站。

來源

2010-10-04 23:24:25 Alec

jQuery深入鏈接Web應用程序

回答

相關問題