2

我的网站使用 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;“标志 2”注释的位置，那么我最终会在 URL 中得到不需要的垃圾，这可能是由于为 URL 编码的哈希标记（...%23 等）。

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

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

4

1 回答 1

0

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

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

祝你好运！！

于 2013-12-11T13:00:17.573 回答