我正在使用 history.js plugin并想知道如何实现 /
类型的 URL。现在我的代码是:
//Check if url hash value exists (for bookmark)
$.history.init(pageload);
//highlight the selected link
$('a[href=' + document.location.hash + ']').addClass('selected');
//Seearch for link with REL set to ajax
$('a[rel=ajax]').click(function () {
//grab the full url
var hash = this.href;
//remove the # value
hash = hash.replace(/^.*#/, '');
//for back button
$.history.load(hash);
//clear the selected class and add the class class to the selected link
$('a[rel=ajax]').removeClass('selected');
$(this).addClass('selected');
//hide the content and show the progress bar
$('#content').hide();
$('#loading').show();
//run the ajax
getPage();
//cancel the anchor tag behaviour
return false;
});
function pageload(hash) {
//if hash value exists, run the ajax
if (hash) getPage();
}
function getPage() {
//generate the parameter for the php script
var data = 'page=' + document.location.hash.replace(/^.*#/, '');
$.ajax({
url: "route.php",
type: "GET",
data: data,
cache: false,
success: function (html) {
//hide the progress bar
$('#loading').hide();
//add the content retrieved from ajax and put it in the #content div
$('#content').html(html);
//display the body with fadeIn transition
$('#content').fadeIn('slow');
}
});
}
URL 始终是 http://localhost/test/index.php#page1
但我想知道如何制作 http://localhost/test/page1
.
我也不希望它显示 index.php 部分,我需要它就像上面的 URL。
最佳答案
这只能使用 HTML5 和 history.pushState()
来完成.
该 API 允许您在不触发页面加载的情况下更改显示的 URL(只要它在同一域中)。然后您可以使用 AJAX 来更改显示的内容。
要查看实际效果,请浏览 github.com 上的任何源代码树 - 他们使用该技术在您浏览文件时“滑入”源代码。
关于javascript - 如何在 history.js 中使用正斜杠而不是哈希 (#)?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9847539/