3 votes

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

À 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 ?

0voto

Roshambo Points 1046

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>

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X