javascript - 强制哈希更改的最佳方法是什么？

Question

我的网站使用 hashchange 触发的 AJAX(以使其对书签更友好)。我遇到的问题是，当我在表单中单击“提交”时，所有 serialize() 的表单数据都将通过 $.post() 迷路了。我之所以知道这一点，是因为我在单击提交后收到“标志 1”警报，并且各种其他测试(警报、回显等)显示这是真的。

这是我当前的代码:

$(document).ready(function() {

var data = '';
var hash = '';
newPage();
alert('Flag 1');

$(window).bind('hashchange', function() {
    hash = window.location.hash;
    if (hash == '') {
        path = window.location.pathname;
        hash = '#' + path.replace(/^\/+/, '');
    }
    data += '&func=' + hash;
    var xhr = $.post(hash, data, function(result) {
        $("maincontent").html(result);
    })
    .done(newPage);
});
// Initialize vars and handle new form elements
function newPage() {
    data = '';
    $('form').submit(function() {
        data = $(this).serialize();
        // Flag 2 - What do I do here?
    });
}
// Load ajax content on first run of document
if ($('#maincontent').html() == '')
    $(window).trigger('hashchange');

});

我正在尝试做的是手动触发 hashchange 事件，同时还更改 URL。问题是，如果我只是设置 window.location.hash = $(this).attr('action'); 然后 return false; 其中“Flag 2”评论是，然后我在 URL 中得到不需要的垃圾，可能是由于哈希标记被编码为 URL(...%23 等)。

我想知道设置哈希值的最佳方法是什么，以及是否有更简单的方法来完成我开始尝试做的事情。

(我也愿意接受建议我尝试实现的导航风格的替代方法的评论)

Answer 1

好吧，我知道这样做有很多错误。但是我们有其他选择，您一定会喜欢:

1. jQuery 历史插件:http://plugins.jquery.com/history/ (演示:http://4nf.org/)
2. 历史 JS:https://github.com/browserstate/history.js/
3. 但如果您愿意避免旧版浏览器支持，我会推荐 HTML5 history.pushState。 (演示:https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history)

祝你好运!