Backbone.js的路由器

我想去的代碼下面的鏈接之一：Backbone.js的路由器

var menukeuze; 

    var AppRouter = Backbone.Router.extend({ 
     routes: { 
      "menukeuze": "getPost", 
      "*actions": "defaultRoute" // matches http://example.com/#anything-here 
     } 
    }); 
    // Instantiate the router 
    var app_router = new AppRouter; 
    app_router.on('route:getPost', function (menukeuze) { 
     // Note the variable in the route definition being passed in here 
     if (menukeuze == 'Welkom') { MakeRequest_goto(menukeuze); } 
     if (menukeuze == 'Dogs1') { MakeRequest_goto(menukeuze); } 
     if (menukeuze == 'Dogs2') { MakeRequest_goto(menukeuze); } 
    }); 
    app_router.on('route:defaultRoute', function (actions) { 
     MakeRequest_goto('Welkom'); 
    }); 
    // Start Backbone history a necessary step for bookmarkable URL's 
    Backbone.history.start(); 

function MakeRequest_goto (ganaarpagina) { 
        $(document).ready(function() { 
        $('#div-main-content').fadeOut(function() { $.ajaxSetup({ 
        cache: false, 
        beforeSend: function() { 
        $('#div-main-content').fadeOut(); 
//    $('#content').hide(); 
//    $('#loading').show(); 
        }, 
        complete: function() { 
//    $('#loading').hide(); 
//    $('#content').show(); 
        }, 
        success: function() { 
//    $('#loading').hide(); 
        $('#div-main-content').fadeIn(); 
//     $('#div-main-content').show(); 
      } 
     }); 
        var $container = $("#div-main-content"); 
      //  $container.load(MakeRequest); 
        alert ("Loading: " + "page_" + ganaarpagina + ".php"); 
          $container.load("page_" + ganaarpagina + ".php"); 
       }); }); }

我通過調用這些路線：

<td> 
<a href="#/menu/Welkom" > 
<img src="images/test1.png" /> 
</td> 

<td> 
<a href="#/menu/Dogs1" > 
<img src="images/test2.png" /> 
</td> 

<td> 
<a href="#/menu/Dogs2" > 
<img src="images/test3.png" /> 
</td>

當我在瀏覽器http://link.nl/#/menu/Welkom我得到的輸入一個完美的網頁，但網址失去了＃。當我刷新頁面時，Web服務器顯示：找不到請求的URL。（這是因爲URL從「＃」來改變，而「＃」）。當我點擊HREF的它從未工程之一，我收到一個： GET http://link.nl/Welkom?_=1365638638131 404（未找到）

哪有我通過這些路由URL加載ajax？我已經試過設置和以下站點的信息，但不確實的幫助：

http://thomasdavis.github.io/examples/restful-app/

http://jsfiddle.net/ambiguous/xkZtB/

Backbone router listener not hitting hash tag

我已經triend更多的人，但他們最終的相同，或沒有任何「完成的信息」。我希望有人看到我的問題？我使用的瀏覽器是：OS X上的Chrome v26。

我使用的Java腳本是：

<script src="http:////ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script src="http:////ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script> 
<script src='http://underscorejs.org/underscore-min.js'></script> 
<script src='http://documentcloud.github.io/backbone/backbone-min.js'></script>

默認路由工作時我瀏覽到http://link.nl/網站。 Link.nl不是一個真實的網站，只是一個例子。問候，

來源

2013-04-11 Gaston

嘗試用pushState的開始Backbone.history是真的：

Backbone.history.start({pushState: "pushState" in window.history});

（。測試只啓用了pushState的瀏覽器兼容，可以將其手動設置爲true或false看到該文檔here）

這將強制url始終沒有hashbang（＃！/）。如果您始終需要它，請將其設置爲false。

現在，對於你的404錯誤，這是因爲當你加載一個「真正的」url（link.nl/menu/Welkom）時，你的web服務器（apache，nginx等）將搜索這個文件（靜態一個，或者通過url重寫的虛擬的）。由於它無法找到它（因爲您希望它只存在於前端客戶端，通過Backbone），它會在顯示頁面之前返回404錯誤。

爲了避免404，你可以設置一個url重寫規則，它將加載包含你的javascript的特定頁面，用於你想要的任何url。

來源

2013-04-11 08:17:42

謝謝你幫助我。我也試過這個pushState，但不幸的是它對我來說並不是解決方案。我仍然在控制檯中得到以下結果： GET http://link.nl/menu/Welkom?_=1365671704329 404（Not Found）jquery.min.js：5 也許我沒有Backbone的問題，但jQuery的實現？仍然啓用pushState，網址從＃變爲不帶＃。而且我認爲我仍然需要＃來讓所有的東西都能正常工作。 – Gaston 2013-04-11 09:16:53

我更新了我的答案，包括與404 404問題。 – 2013-04-11 09:21:35

好吧，謝謝你的快速反應，並指出我的網址重寫的東西。我將在這裏找到如何解決這個問題的解決方案。 – Gaston 2013-04-11 09:27:54

Backbone.js的路由器

回答

相關問題