Πώς μπορώ να ανακατευθύνω τον χρήστη από μια σελίδα σε μια άλλη χρησιμοποιώντας jQuery ή καθαρή JavaScript;
Το jQuery δεν είναι απαραίτητο, και το window.location.replace(...)
θα προσομοιώσει καλύτερα μια ανακατεύθυνση HTTP.
Το window.location.replace(...)
είναι καλύτερο από τη χρήση του window.location.href
, επειδή το replace()
δεν διατηρεί την αρχική σελίδα στο ιστορικό της συνεδρίας, πράγμα που σημαίνει ότι ο χρήστης δεν θα'κολλήσει σε ένα ατελείωτο φιάσκο με το κουμπί επιστροφής.
Αν θέλετε να προσομοιώσετε ότι κάποιος κάνει κλικ σε έναν σύνδεσμο, χρησιμοποιήστε το
location.href
Αν θέλετε να προσομοιώσετε μια ανακατεύθυνση HTTP, χρησιμοποιήστε location.replace
Για παράδειγμα:
// similar behavior as an HTTP redirect
window.location.replace("http://stackoverflow.com");
// similar behavior as clicking on a link
window.location.href = "http://stackoverflow.com";
Θα βοηθούσε αν ήσασταν λίγο πιο περιγραφικός στο τι προσπαθείτε να κάνετε. Αν προσπαθείτε να δημιουργήσετε δεδομένα σελιδοποίησης, υπάρχουν κάποιες επιλογές για το πώς το κάνετε αυτό. Μπορείτε να δημιουργήσετε ξεχωριστούς συνδέσμους για κάθε σελίδα στην οποία θέλετε να μπορείτε να μεταβείτε απευθείας.
<a href='/path-to-page?page=1' class='pager-link'>1</a>
<a href='/path-to-page?page=2' class='pager-link'>2</a>
<span class='pager-link current-page'>3</a>
...
Σημειώστε ότι η τρέχουσα σελίδα στο παράδειγμα αντιμετωπίζεται διαφορετικά στον κώδικα και με CSS.
Αν θέλετε τα δεδομένα της σελίδας να αλλάζουν μέσω AJAX, εδώ θα πρέπει να χρησιμοποιηθεί η jQuery. Αυτό που θα κάνατε είναι να προσθέσετε έναν χειριστή κλικ σε κάθε μία από τις ετικέτες άγκυρας που αντιστοιχούν σε διαφορετική σελίδα. Αυτός ο χειριστής κλικ θα ενεργοποιούσε κάποιο κώδικα jQuery που θα έπαιρνε την επόμενη σελίδα μέσω AJAX και θα ενημέρωνε τον πίνακα με τα νέα δεδομένα. Το παρακάτω παράδειγμα υποθέτει ότι έχετε μια υπηρεσία ιστού που επιστρέφει τα δεδομένα της νέας σελίδας.
$(document).ready( function() {
$('a.pager-link').click( function() {
var page = $(this).attr('href').split(/\?/)[1];
$.ajax({
type: 'POST',
url: '/path-to-service',
data: page,
success: function(content) {
$('#myTable').html(content); // replace
}
});
return false; // to stop link
});
});
var url = 'asdf.html';
window.location.href = url;