Existe-t-il un meilleur moyen de suivre la pagination avec des hashtags ?

Question

À l'aide d'un événement hashchange, je détecte le moment où un utilisateur clique sur le bouton "retour" dans un navigateur et je modifie l'URL en conséquence. Existe-t-il une meilleure façon de procéder pour la pagination ? Actuellement, je modifie l'URL après qu'un utilisateur ait cliqué sur mon contrôle de pagination de la manière suivante :

$(".pager").click(function(){

    var start = null;
    if ($.browser.msie) {    
        start = $(this).attr('href').slice($(this).attr('href').indexOf('#')+1);
    } 
    else {    
        start = $(this).attr('href').substr(1);
    }

    $('#start').val(start);

    $.post("visits_results.php", $("#profile_form_id").serialize(),
    function(data) {
        $('#search_results').html(data);
        location.href = "#visits=" + start; 
    }); 

    return false;
});

Mon javascript pour détecter le bouton retour ressemble à ceci :

function myHashChangeCallback(hash) {

    if (hash == "") {
        $("#loadImage").show();

        var no_cache = new Date().getTime();
        $('#main').load("home.php?cache=" + no_cache, function () { 
        $("#loadImage").hide();
    });

    return false;

    }
    else {
    // adding code to parse the hash URL and see what page I'm on...is there a better way?; 
    }
}

function hashCheck() {
    var hash = window.location.hash;
    if (hash != _hash) {
        _hash = hash;
        myHashChangeCallback(hash);
    }
}

Je prévois actuellement de vérifier chaque hashtag et la valeur pour voir quelle page je dois charger, à moins qu'il n'y ait un meilleur moyen plus efficace.

Des idées ou des suggestions ?

Answer 1

El Adresse jQuery fait cela très bien. Une fois configuré, il fournit une série d'événements de navigation logiques que vous pouvez utiliser. Il offre également un très bon support pour history.pushState() qui élimine la nécessité des hashtags dans les navigateurs récents et offre un support de repli tout aussi efficace pour les navigateurs qui ne prennent pas en charge pushState.

Une mise en œuvre simple ressemblerait à ceci :

// Run some code on initial load
$.address.init(function(e) {
    // Address and path details can be found in the event object
    console.log(e);
});

// Handle hashtag/pushState change events
$.address.change(function(e) {
    // Do more fancy stuff. Don't forget about the event object.
    console.log(e);
});

// Setup jQuery address on some elements
$('a').address();

Pour activer le support de pushState(), passez un argument au script comme ceci :

<script type="text/javascript" src="jquery.address-1.3.min.js?state=/absolute/path/to/your/application"></script>