Почему это не работает?

Question

Я пытаюсь достичь Facebook, как навигация по страницам, используя AJAX. Я написал следующий код.

if ("onhashchange" in window) { 
    window.onhashchange = function() { 
     locationChanged(window.location.href); 
    } 
} 
else { 
    var storedURL = window.location.href; 
    window.setInterval(function() { 
     if (window.location.href != storedURL) { 
      storedURL = window.location.href; 
      locationChanged(storedURL); 
     } 
    }, 250); 
} 

function locationChanged(e) { 
    if (window.location.href.include('#!')) { 
     var paths = window.location.href.split("#!"); 
     if (paths.length >= 2) { 
      var pos = paths.length - 1; 

      if (paths[pos].startsWith("/")) 
       paths[pos] = paths[pos].substr(1); 

      $('#holder').load(paths[pos]); 
     } 
    } 
    else { 
     if (window.location.href.endsWith('Index.html') 
     || !window.location.href.endsWith('.html')) { 
      //this is first page 
      redirect("Login.html"); 
     } 
    } 
} 

$(document).ready(function() { 
    if (window.location.href.endsWith('Index.html') 
    || !window.location.href.endsWith('.html')) { 
     //this is first page 
     redirect("Login.html"); 
    } 

    captureLinks(); 
}); 

function captureLinks() { 
    $('a').click(function(e) { 
     e.preventDefault(); 
     redirect($(this).attr("href")); 
    }); 
} 

function redirect(page) { 
    var path = page; 

    if (window.location.href.include('#!')) { 
     var paths = window.location.href.split("#!"); 

     var pos = paths.length - 2; 

     if (!paths[pos].endsWith("/")) 
      paths[pos] += "/"; 

     if (!page.startsWith("/")) 
      page = "/" + page; 

     path = paths[pos] + "#!" + page; 
    } 
    else { 
     if (path.endsWith(".html")) 
      path = window.location.href.trimEndTill("/"); 
     else 
      path = window.location.href; 

     if (!path.endsWith("/")) 
      path += "/"; 

     if (!page.startsWith("/")) 
      page = "/" + page; 

     path += "#!" + page; 
    } 

    window.location.href = path;  
} 

Хорошо, что код работает, но имеет единственную проблему. Существует страница с Index.html, которая является основным входом страницы приложения и когда я пишу сказать ...

http://localhost:8081/

Он преобразует его в ...

http://localhost:8081/#!/Login.html

Какого идеально. Но когда я указываю это сказать ...

http://localhost:8081/Index.html

Она делает его ...

http://localhost:8081/Index.html/#!/Login.html

Это было создающего сообщение об ошибке 404, как нет страницы с именем «Index.html /». Я изменил код, чтобы он смог обнаружить Index.html и сначала удалить его, прежде чем указывать его на Login.html. Хотя код дает правильный результат теперь даже с Index.html, как ...

http://localhost:8081/#!/Login.html

Но проблема в том, что никогда не загрузить страницу (login.html) в организме с помощью $ .load функции. Что-то не так? Я также хотел бы знать, эффективен ли мой код?

Answer 1

Что вам действительно нужно, это jQuery Address plugin. (samples)