Comment rediriger vers une autre page Web?

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

7735
02 февр. fixé par venkatachalam le 02 février 2009-02-02 15:54 '09 à 15:54 2009-02-02 15:54
@ 80 réponses
  • 1
  • 2
  • 3

On ne fait pas que rediriger avec jQuery

jQuery n'est pas requis, et window.location.replace(...) mieux à la redirection HTTP simulée.

window.location.replace(...) préférable à window.location.href , car replace() n'enregistre pas la page d'origine dans l'historique de la session. En d'autres termes, l'utilisateur n'est pas coincé dans le fiasco sans fin du bouton Précédent.

Si vous souhaitez imiter quelqu'un en cliquant sur le lien, utilisez location.href

Si vous souhaitez simuler une redirection HTTP, utilisez location.replace

Par exemple:

 // 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"; 
13553
03 февр. la réponse est donnée par Ryan McGeary le 03 février 2009-02-03 07:24 '09 à 7:24 2009-02-03 07:24

AVERTISSEMENT: Cette réponse a simplement été fournie comme solution possible. ce n'est évidemment pas la meilleure solution, car jQuery est nécessaire pour cela. Au lieu de cela, préférez une solution javascript propre.

border=0
1540
28 окт. réponse donnée par Boris Guéry le 28 octobre 2009-10-28 19:35 '09 à 19:35 2009-10-28 19:35

Méthode de redirection de page javascript standard "vanilla":

window.location.href = 'newPage.html';


Si vous êtes ici parce que vous perdez HTTP_REFERER lors de la redirection, continuez à lire:


La section suivante est destinée à ceux qui utilisent HTTP_REFERER comme une des nombreuses mesures sécurisées (bien que ce ne soit pas une mesure de protection efficace). Si vous utilisez Internet Explorer version 8 ou inférieure, ces variables sont perdues lors de toute forme de redirection de la page JavaScript (location.href, etc.).

Ci-dessous, nous allons implémenter une alternative pour IE8 et ci-dessous afin de ne pas perdre HTTP_REFERER. Sinon, vous pouvez presque toujours utiliser window.location.href .

Les tests sur HTTP_REFERER (insertion d'URL, session, etc.) peuvent être utiles pour déterminer si une demande est légitime. ( Remarque: il existe également des moyens de contourner / de tricher ces référents, comme indiqué dans la description des liens avec une erreur)


Une solution simple pour les tests inter-navigateurs (restauration de window.location.href pour Internet Explorer 9+ et tous les autres navigateurs)

Utilisation: redirect('anotherpage.aspx');

 function redirect (url) { var ua = navigator.userAgent.toLowerCase(), isIE = ua.indexOf('msie') !== -1, version = parseInt(ua.substr(4, 2), 10); // Internet Explorer 8 and lower if (isIE  version < 9) { var link = document.createElement('a'); link.href = url; document.body.appendChild(link); link.click(); } // All other browsers can use the standard window.location.href (they don't lose HTTP_REFERER like Internet Explorer 8  lower does) else { window.location.href = url; } } 
556
27 июля '12 в 17:41 2012-07-27 17:41 la réponse est donnée par Mark Pieszak - DevHelp.Online 27 juillet '12 à 17:41 2012-07-27 17:41

Il y a plusieurs façons de le faire.

 // 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') 
369
28 янв. Govind Singh a répondu le 28 janvier 2014-01-28 07:28 '14 à 7:28 2014-01-28 07:28

Cela fonctionne pour tous les navigateurs:

 window.location.href = 'your_url'; 
292
23 окт. réponse donnée à Fred le 23 octobre. 2010-10-23 02:45 '10 à 2:45 am 2010-10-23 02:45

Cela vous aiderait si vous étiez un peu plus visuel sur ce que vous essayez de faire. Si vous essayez de générer des données paginées, vous disposez de plusieurs options. Vous pouvez créer des liens distincts pour chaque page avec laquelle vous souhaitez créer un lien direct.

 <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 actuelle de l'exemple est gérée différemment dans le code et avec CSS.

Si vous souhaitez que les données de la page soient modifiées avec AJAX, jQuery sera impliqué ici. Ce que vous feriez, c'est d'ajouter un gestionnaire de clics pour chacune des balises d'ancrage correspondant à l'autre page. Ce gestionnaire appelle du code jQuery envoyé et affiche la page suivante via AJAX et met à jour le tableau avec les nouvelles données. Dans l'exemple ci-dessous, il est supposé 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 }); }); 
273
02 февр. La réponse est donnée par tvanfosson le 02 février. 2009-02-02 16:18 '09 à 16:18 2009-02-02 16:18

Je pense également que location.replace(URL) est la meilleure solution, mais si vous souhaitez informer les moteurs de recherche de votre redirection (ils n'analysent pas le code JavaScript pour afficher la redirection), vous devez ajouter une balise méta rel="canonical" sur votre site.

L'ajout d'une section noscript contenant des balises méta de mise à jour HTML est également une bonne solution. Je vous suggère d'utiliser cet outil de redirection javascript pour créer des redirections. Il prend également en charge Internet Explorer pour l'envoi d'un référent HTTP.

Exemple de code sans délai ressemble à ceci:

 <!-- Place this snippet right after opening the head tag to make it work properly --> <!-- This code is licensed under GNU GPL v3 --> <!-- You are allowed to freely copy, distribute and use this code, but removing author credit is strictly prohibited --> <!-- Generated by http://insider.zone/tools/client-side-url-redirect-generator/ --> <!-- REDIRECTING STARTS --> <link rel="canonical" href="https://yourdomain.com/"/> <noscript> <meta http-equiv="refresh" content="0;URL=https://yourdomain.com/"> </noscript> <!--[if lt IE 9]><script type="text/javascript">var IE_fix=true;</script><![endif]--> <script type="text/javascript"> var url = "https://yourdomain.com/"; if(typeof IE_fix != "undefined") // IE8 and lower fix to pass the http referer { document.write("redirecting..."); // Don't remove this line or appendChild() will fail because it is called before document.onload to make the redirect as fast as possible. Nobody will see this text, it is only a tech fix. var referLink = document.createElement("a"); referLink.href = url; document.body.appendChild(referLink); referLink.click(); } else { window.location.replace(url); } // All other browsers </script> <!-- Credit goes to http://insider.zone/ --> <!-- REDIRECTING ENDS --> 
232
25 апр. la réponse est donnée par Patartics Milán le 25 avril 2013-04-25 13:12 13 à 13:12 2013-04-25 13:12

Mais si quelqu'un souhaite rediriger vers la page d'accueil, il peut utiliser l'extrait suivant.

 window.location = window.location.host 

Il serait utile d’avoir trois environnements différents: développement, production et production.

Vous pouvez examiner cette fenêtre ou l'objet window.location en plaçant simplement ces mots dans la console Chrome ou Firebug .

206
30 окт. La réponse est donnée par Nadeem Yasin le 30 octobre. 2012-10-30 15:15 '12 à 15h15 2012-10-30 15:15

JavaScript vous propose de nombreuses méthodes pour extraire et modifier l'URL actuelle affichée dans la barre d'adresse de votre navigateur. Toutes ces méthodes utilisent l'objet Location, qui est une propriété de l'objet Window. Vous pouvez créer un nouvel objet Location avec l'URL actuelle comme suit.

 var currentLocation = window.location; 

Structure de base de l'URL

 <protocol>//<hostname>:<port>/<pathname><search><hash> 

2019

195
23 дек. Nikhil Agrawal a répondu le 23 décembre 2013-12-23 16:35 13 à 16:35 2013-12-23 16:35

Devrait juste être configuré en utilisant window.location .

Exemple:

 window.location = "https://stackoverflow.com/"; 

Voici le précédent article sur ce sujet:

Comment rediriger vers une autre page Web?

182
16 февр. La réponse est donnée à Newse le 16 février. 2014-02-16 17:42 '14 à 17:42 2014-02-16 17:42

En fait, jQuery est simplement une infrastructure JavaScript et, pour accomplir certaines choses, telles que la redirection dans ce cas, vous pouvez simplement utiliser du JavaScript pur. Dans ce cas, vous avez 3 options pour utiliser le JavaScript vanille:

1) Déterminer un emplacement à l’aide d’un échange, cela remplace l’historique de la page en cours, signifie que vous ne pouvez pas utiliser le bouton Précédent pour revenir à la page d’origine.

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

2) En utilisant l’emplacement de destination , l’historique sera sauvegardé pour vous et, à l’aide du bouton Précédent, vous pourrez revenir à la page d’origine:

 window.location.assign("http://stackoverflow.com"); 

3) Je recommande d'utiliser l'une de ces méthodes précédentes, mais il pourrait s'agir de la troisième option utilisant du javascript pur:

 window.location.href="http://stackoverflow.com"; 

Vous pouvez également écrire une fonction dans jQuery pour la traiter, mais cela n'est pas recommandé car il ne s'agit que d'une seule ligne de fonction JavaScript. Vous pouvez également utiliser toutes les fonctions énumérées ci-dessus sans fenêtre si vous vous trouvez déjà dans son champ d'application, par exemple window.location.replace("http://stackoverflow.com"); peut être location.replace("http://stackoverflow.com");

Je les montre également tous dans l'image ci-dessous:

2019

26 февр. Répondre Alireza 26 fév. 2017-02-26 16:36 17 à 16h36 2017-02-26 16:36

Avant de commencer, jQuery est une bibliothèque JavaScript utilisée pour manipuler le DOM. Par conséquent, vous ne devez pas utiliser jQuery pour rediriger la page.

Citation de jquery.com:

Bien que jQuery puisse fonctionner sans problèmes graves dans les anciennes versions du navigateur, nous ne testons pas activement jQuery avec celles-ci et nous ne réparons généralement pas les erreurs qui pourraient y apparaître.

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

Ainsi, jQuery n’est pas une solution complète de compatibilité ascendante.

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

Cette page sera redirigé vers Google 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 options suivantes sont possibles:

 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" 

Lors du remplacement, le bouton Précédent ne permet pas de revenir à la page de redirection, comme si cela ne s'était jamais passé dans l'historique. Si vous souhaitez que l'utilisateur revienne à la page de redirection, utilisez window.location.href ou window.location.assign . Si vous utilisez l'option qui permet à l'utilisateur de revenir à la page de redirection, n'oubliez pas que lorsque vous entrez dans la page de redirection, celle-ci vous redirige. Par conséquent, tenez compte de cela lorsque vous choisissez une option de redirection. Dans les cas où la page n'est redirigée que lorsque l'action est effectuée par l'utilisateur, la présence de la page dans l'historique des boutons Précédent sera dans l'ordre. Mais si la page est automatiquement redirigée, vous devez utiliser un remplacement afin que l'utilisateur puisse utiliser le bouton Précédent sans recevoir de retour forcé à la page envoyée par redirection.

Vous pouvez également utiliser des métadonnées pour démarrer la redirection de page, comme indiqué ci-dessous.

META Update

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

Emplacement META

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

Détournement de base

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

Sur cette page, vous pouvez trouver de nombreux autres moyens de rediriger votre client peu méfiant vers une page qu’ils ne souhaitent pas, mais aucun d’eux ne dépend de jQuery:

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

Je voudrais aussi souligner que les gens n'aiment pas être redirigés au hasard. Réorientez les personnes uniquement lorsque cela est absolument nécessaire. Si vous commencez à rediriger les utilisateurs dans un ordre aléatoire, ils ne rentreront jamais sur votre site.

La partie suivante est hypothétique:

Vous pouvez également recevoir un message en tant que site malveillant. Si cela se produit, lorsque les internautes cliquent sur le lien vers votre site, le navigateur de l'utilisateur peut l'avertir que votre site est malveillant. Il peut également arriver que les moteurs de recherche commencent à se dégrader si des personnes signalent de mauvaises expériences sur votre site.

Consultez les consignes relatives aux webmasters de Google pour les redirection: https://support.google.com/webmasters/answer/2721217?hl=fr>

Voici une petite page amusante qui vous jette hors de la page.

 <!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 pages, vous obtiendrez une nouvelle boucle garantissant que votre utilisateur ne voudra plus jamais utiliser votre site.

28 авг. réponse donnée par Patrick W. McMahon le 28 août 2014-08-28 00:50 '14 à 0:50 2014-08-28 00:50
 var url = 'asdf.html'; window.location.href = url; 
151
13 окт. la réponse est donnée par l' utilisateur188973 le 13 octobre 2009-10-13 12:36 '09 à 12:36 2009-10-13 12:36

Vous pouvez le faire sans jQuery comme:

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

Et si vous ne voulez que jQuery, vous pouvez le faire comme ceci:

 $jq(window).attr("location","http://yourdomain.com"); 
135
23 мая '12 в 16:03 2012-05-23 16:03 la réponse est donnée à ScoRpion le 23 mai 2012 à 16h03. 2012-05-23 16:03

Cela fonctionne avec jQuery:

 $(window).attr("location", "http://google.fr"); 
133
05 сент. La réponse est donnée à xloadx le 05 septembre. 2011-09-05 20:25 '11 à 20:25 2011-09-05 20:25

# Transférer une 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 spécifier l'URL complète sous la forme window.location = "www.google.co.in"; .

82
06 февр. la réponse est donnée par Sakthi Karthik le 06 février 2014-02-06 13:28 14 à 13:28 2014-02-06 13:28

La question est donc de savoir comment rediriger la page, pas comment rediriger vers le site Web.

Pour ce faire, vous devez utiliser javascript. Voici un petit code qui créera une page de redirection dynamique.

 <script> var url = window.location.search.split('url=')[1]; // Get the URL after ?url= if( url ) window.location.replace(url); </script> 

Alors dites-moi que vous venez de mettre cet extrait dans le fichier redirect/index.html de votre site Web, vous pouvez l'utiliser comme ceci.

http://www.mywebsite.com/redirect?url=http://stackoverflow.com

Et si vous suivez ce lien, il vous redirigera automatiquement vers stackoverflow.com .

Lien de documentation

Et comment créer une simple page de redirection avec javascript

Modifier:

Il y a aussi un commentaire. J'ai ajouté window.location.replace à mon code, car je pense que cela convient à la page de redirection, mais vous devez savoir que lorsque vous utilisez window.location.replace et que vous êtes redirigé lorsque vous cliquez sur le bouton Précédent de votre navigateur. , elle ne reviendra pas à la page de redirection, et elle reviendra à la page devant elle, jetez un oeil à cette petite démo.

Exemple:

Processus: garder à la maison => rediriger la page vers Google => google

Quand dans google: google => bouton de retour dans le navigateur => enregistrer à la maison

Donc, si cela répond à vos besoins, tout devrait bien se passer. Si vous souhaitez inclure la page de redirection dans l'historique de votre navigateur, remplacez-la.

 if( url ) window.location.replace(url); 

avec

 if( url ) window.location.href = url; 
74
31 авг. Réponse donnée par iConnor le 31 août 2013-08-31 02:46 '13 à 2:46 2013-08-31 02:46

Vous devriez mettre cette ligne dans votre code:

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

Si vous n'avez pas jQuery, accédez à JavaScript à l'aide de:

 window.location.replace("http://stackoverflow.com"); window.location.href("http://stackoverflow.com"); 
74
27 янв. Répondre Ashish Ratan 27 Jan 2014-01-27 13:11 14 à 13:11 2014-01-27 13:11

Dans votre fonction de clic, ajoutez simplement:

 window.location.href = "The URL where you want to redirect"; $('#id').click(function(){ window.location.href = "http://www.google.com"; }); 
69
14 нояб. Réponse donnée par Swaprks le 14 novembre. 2012-11-14 05:17 '12 à 5:17 2012-11-14 05:17

***** LA QUESTION ORIGINALE ÉTAIT - "COMMENT RÉVISER UTILISER JQUERY", DÈS QUE LA RÉPONSE IMPLÉMENT JQUERY >> EXERCICE GRATUIT *****

Il suffit de rediriger vers la page en utilisant 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 la page, puis utiliser jQuery pour ajouter des effets spéciaux, répondre aux actions de l'utilisateur ou pour afficher et masquer le contenu à l'intérieur ou à l'extérieur de l'élément choisi. 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 go redirect window.location.href = "/contact/"; },500); }); 

Imaginez que quelqu'un ait écrit un script / plug-in contenant 10 000 lignes de code? Eh bien, avec jQuery, vous pouvez vous connecter à ce code avec une seule ligne ou deux.

66
26 дек. la réponse est donnée SergeDirect 26 déc. 2014-12-26 22:08 14 à 22:08 2014-12-26 22:08

Essayez ce qui suit:

 location.assign("http://www.google.com"); 

exemple d'extrait de code .

57
19 нояб. Répondre tilak 19 nov. 2013-11-19 07:01 13 à 7h01 am 2013-11-19 07h01

jQuery n'est pas requis. Vous pouvez faire ceci:

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

C'est aussi simple que ça!

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

53
11 июля '13 в 20:40 2013-07-11 20:40 la réponse est donnée par le maire Monty, le 11 juillet 2013 à 20h40. 2013-07-11 20:40

D'abord écrire correctement. Vous souhaitez naviguer dans l'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 parcourir les pages de votre application, j'ai également du code si vous le souhaitez.

50
06 июня '13 в 15:37 2013-06-06 15:37 la réponse est donnée par Anup le 06 juin 13 à 15:37 2013-06-06 15:37

Vous pouvez rediriger vers jQuery comme suit:

 $(location).attr('href', 'http://yourPage.com/'); 
50
05 сент. réponse donnée à Azam Alvi 05 sept. 2014-09-05 19:36 14 à 19:36 2014-09-05 19:36

ECMAScript 6 + jQuery, 85 octets

 $({jQueryCode:(url)=>location.replace(url)}).attr("jQueryCode")("http://example.com") 

S'il te plaît, ne me tue pas, c'est une blague. C'est une blague. C'est une blague.

Cela "apportait une réponse à la question" dans le sens où il demandait une solution "utilisant jQuery", ce qui dans le cas présent impliquait son intégration dans l'équation.

Ferrybig a apparemment besoin d'une explication de la blague (plaisantant encore, je suis sûr que les possibilités sont limitées sous la forme d'une critique), alors sans plus tarder:

D'autres réponses utilisent jQuery attr() inutilement pour les objets location ou window .

Cette réponse en abuse aussi, mais plus drôle. Вместо того, чтобы использовать его для установки местоположения, это использует attr() для извлечения функции, которая устанавливает местоположение.

Эта функция называется jQueryCode , хотя ничего нет jQuery, и вызов функции somethingCode просто ужасен, особенно когда что-то не является даже языком.