javascript site js - Comment puis-je rediriger vers une autre page Web?




15 Answers

AVERTISSEMENT: Cette réponse a simplement été fournie comme solution possible. ce n'est évidemment pas la meilleure solution, car elle nécessite jQuery. Au lieu de cela, préférez la solution JavaScript pure.

$(location).attr('href', 'http://stackoverflow.com')
envoyer sur html

Comment rediriger l'utilisateur d'une page à une autre à l'aide de jQuery ou de JavaScript pur?




Utilisation:

// window.location
window.location.replace('http://www.example.com')
window.location.assign('http://www.example.com')
window.location.href = 'http://www.example.com'
document.location.href = '/path'

// window.history
window.history.back()
window.history.go(-1)

// window.navigate; ONLY for old versions of Internet Explorer
window.navigate('top.jsp')


// Probably no bueno
self.location = 'http://www.example.com';
top.location = 'http://www.example.com';

// jQuery
$(location).attr('href','http://www.example.com')
$(window).attr('location','http://www.example.com')
$(location).prop('href', 'http://www.example.com')



Cela aiderait si vous décriviez un peu plus ce que vous essayez de faire. Si vous essayez de générer des données paginées, vous pouvez procéder de différentes manières. Vous pouvez générer des liens distincts pour chaque page à laquelle vous souhaitez pouvoir accéder directement.

<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>
...

Notez que la page en cours dans l'exemple est gérée différemment dans le code et avec CSS.

Si vous souhaitez que les données paginées soient modifiées via AJAX, c'est ici que jQuery entrerait. Ce que vous feriez, c'est d'ajouter un gestionnaire de clic à chacune des balises d'ancrage correspondant à une page différente. Ce gestionnaire de clics appelle un code jQuery qui va chercher la page suivante via AJAX et met à jour la table avec les nouvelles données. L'exemple ci-dessous suppose que vous disposez d'un service Web qui renvoie les nouvelles données de page.

$(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
    });
});



Mais si quelqu'un veut rediriger sa page d'accueil, il peut utiliser l'extrait de code suivant.

window.location = window.location.host

Il serait utile de disposer de trois environnements différents: développement, mise en scène et production.

Vous pouvez explorer cet objet window ou window.location en mettant simplement ces mots dans la console Chrome ou la console de Firebug .







Avant de commencer, jQuery est une bibliothèque JavaScript utilisée pour la manipulation DOM. Donc, vous ne devriez pas utiliser jQuery pour une redirection de page.

Une citation de Jquery.com:

Bien que jQuery puisse fonctionner sans problèmes majeurs dans les versions de navigateur antérieures, nous ne testons pas activement jQuery avec celles-ci et, en règle générale, ne corrigeons pas les bugs qui peuvent y apparaître.

Il a été trouvé ici: https://jquery.com/browser-support/

Donc, jQuery n'est pas une solution ultime pour la compatibilité ascendante.

La solution suivante, qui utilise JavaScript brut, fonctionne dans tous les navigateurs et est standard depuis longtemps. Vous n'avez donc pas besoin de bibliothèques pour la prise en charge de plusieurs navigateurs.

Cette page sera redirigé vers google.com après 3000 millisecondes.

<!DOCTYPE html>
<html>
    <head>
        <title>example</title>
    </head>
    <body>
        <p>You will be redirected to google shortly.</p>
        <script>
            setTimeout(function(){
                window.location.href="http://www.google.com"; // The URL that will be redirected too.
            }, 3000); // The bigger the number the longer the delay.
        </script>
    </body>
</html>

Les différentes options sont les suivantes:

window.location.href="url"; // Simulates normal navigation to a new page
window.location.replace("url"); // Removes current URL from history and replaces it with a new URL
window.location.assign("url"); // Adds new URL to the history stack and redirects to the new URL

window.history.back(); // Simulates a back button click
window.history.go(-1); // Simulates a back button click
window.history.back(-1); // Simulates a back button click
window.navigate("page.html"); // Same as window.location="url"

Lorsque vous utilisez le remplacement, le bouton Précédent ne reviendra pas à la page de redirection, comme si cela n’était jamais dans l’historique. Si vous souhaitez que l'utilisateur puisse revenir à la page de redirection, utilisez window.location.href ou window.location.assign . Si vous utilisez une option qui permet à l'utilisateur de revenir à la page de redirection, n'oubliez pas que lorsque vous entrez dans la page de redirection, il vous redirigera. Mettez donc cela en considération lorsque vous choisissez une option pour votre redirection. Dans des conditions où la page est uniquement redirigée lorsqu'une action est effectuée par l'utilisateur, le fait d'avoir la page dans l'historique du bouton de retour sera correct. Mais si la page redirige automatiquement, vous devez utiliser l'option de remplacement afin que l'utilisateur puisse utiliser le bouton Précédent sans être forcé de revenir à la page que la redirection envoie.

Vous pouvez également utiliser les métadonnées pour exécuter une redirection de page comme suit.

META Refresh

<meta http-equiv="refresh" content="0;url=http://evil.com/" />

META Localisation

<meta http-equiv="location" content="URL=http://evil.com" />

Détournement de base

<base href="http://evil.com/" />

Vous trouverez de nombreuses autres méthodes pour rediriger votre client sans méfiance vers une page à laquelle elles ne souhaitent pas aller, qui peuvent être trouvées sur cette page (aucune d’elles ne dépend de jQuery):

https://code.google.com/p/html5security/wiki/RedirectionMethods

Je tiens également à souligner que les gens n'aiment pas être redirigés au hasard. Réorienter les personnes uniquement lorsque cela est absolument nécessaire. Si vous commencez à rediriger des personnes au hasard, elles ne seront plus jamais consultées sur votre site.

La partie suivante est hypothétique:

Vous pouvez également être signalé comme site malveillant. Si cela se produit, lorsque les internautes cliquent sur un lien vers votre site, le navigateur de l'utilisateur peut l'avertir que votre site est malveillant. Ce qui peut également arriver, c'est que les moteurs de recherche peuvent commencer à perdre votre classement si des internautes signalent une mauvaise expérience sur votre site.

Consultez les consignes de Google pour les webmasters concernant les redirections: https://support.google.com/webmasters/answer/2721217?hl=en&ref_topic=6001971

Voici une petite page amusante qui vous met à la porte.

<!DOCTYPE html>
<html>
    <head>
        <title>Go Away</title>
    </head>
    <body>
        <h1>Go Away</h1>
        <script>
            setTimeout(function(){
                window.history.back();
            }, 3000);
        </script>
    </body>
</html>

Si vous combinez les deux exemples de page, vous obtiendrez une boucle de redirection qui garantira que votre utilisateur ne voudra plus jamais utiliser votre site.




Vous pouvez le faire sans jQuery en tant que:

window.location = "http://yourdomain.com";

Et si vous voulez seulement jQuery, vous pouvez le faire comme:

$jq(window).attr("location","http://yourdomain.com");



# Redirection de page HTML à l'aide de jQuery / JavaScript

Essayez cet exemple de code:

function YourJavaScriptFunction()
{
    var i = $('#login').val();
    if (i == 'login')
        window.location = "login.php";
    else
        window.location = "Logout.php";
}

Si vous souhaitez donner une URL complète sous la forme window.location = "www.google.co.in"; .




Vous devez mettre cette ligne dans votre code:

$(location).attr("href","http://.com");

Si vous n'avez pas jQuery, utilisez JavaScript avec:

window.location.replace("http://.com");
window.location.href("http://.com");



***** LA QUESTION ORIGINALE ÉTAIT - "COMMENT REDIREINTER UTILISATION DE JQUERY", DÈS QUE REPONSE IMPLÉMENTS JQUERY >> CAS D’UTILISATION COMPLÉMENTAIRE *****

Pour simplement rediriger vers une page avec JavaScript:

  window.location.href = "/contact/";

Ou si vous avez besoin d'un délai:

setTimeout(function () {
  window.location.href = "/contact/";
}, 2000);   // Time in milliseconds

jQuery vous permet de sélectionner facilement des éléments d'une page Web. Vous pouvez trouver tout ce que vous voulez sur une page, puis utiliser jQuery pour ajouter des effets spéciaux, réagir aux actions de l'utilisateur ou pour afficher et masquer le contenu à l'intérieur ou à l'extérieur de l'élément sélectionné. Toutes ces tâches commencent par savoir comment sélectionner un élément ou un événement .

     $('a,img').on('click',function(e){
         e.preventDefault();
         $(this).animate({
             opacity: 0 //Put some CSS animation here
         }, 500);
         setTimeout(function(){
           // OK, finished jQuery staff, let's go redirect
           window.location.href = "/contact/";
         },500);
     });

Imaginez que quelqu'un ait écrit un script / plugin de 10000 lignes de code?! Eh bien, avec jQuery, vous pouvez vous connecter à ce code avec juste une ligne ou deux.




jQuery n'est pas nécessaire. Tu peux le faire:

window.open("URL","_self","","")

C'est aussi simple que ça!

Le meilleur moyen de lancer une requête HTTP est d' document.loacation.href.replace('URL') .




D'abord écrire correctement. Vous souhaitez naviguer dans une application pour un autre lien à partir de votre application pour un autre lien. Voici le code:

window.location.href = "http://www.google.com";

Et si vous voulez naviguer dans les pages de votre application, j'ai aussi du code, si vous voulez.




Dans JavaScript et jQuery, nous pouvons utiliser le code suivant pour rediriger une page vers une autre page:

window.location.href="http://google.com";
window.location.replace("page1.html");



Voici une redirection de délai. Vous pouvez régler le délai sur ce que vous voulez:

<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Your Document Title</title>
    <script type="text/javascript">
        function delayer(delay) {
            onLoad = setTimeout('window.location.href = "http://www.google.com/"', delay);
        }
    </script>
</head>

<body>
    <script>
        delayer(8000)
    </script>
    <div>You will be redirected in 8 seconds!</div>
</body>

</html>



Je viens juste de mettre à jour ce ridicule avec encore une nouvelle méthode jQuery:

var url = 'http://www.fiftywaystoleaveyourlocation.com';
$(location).prop('href', url);





Related