2

私のウェブサイトは、ハッシュチェンジによってトリガーされる 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');

});

私がやろうとしているのは、URL を変更しながら手動でhashchange イベントを発生させることです。問題は、「Flag 2」コメントの場所を設定しただけwindow.location.hash = $(this).attr('action');でreturn false;は、おそらく URL 用にエンコードされているハッシュマーク (...%23 など) が原因で、URL に不要なゴミが入ってしまうことです。

ハッシュを設定する最良の方法は何か、また、最初にやろうとしていることを行うためのより簡単な方法があるかどうか疑問に思っています。

(私が達成しようとしているナビゲーション スタイルの代替アプローチを提案するコメントも受け付けています)

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 に答える