web-dev-qa-db-fra.com

Comment rediriger un bouton vers une autre page à l'aide de jQuery ou simplement de Javascript

Je fabrique un prototype et je souhaite que le bouton de recherche soit lié à un exemple de page de résultats de recherche.

Comment puis-je rediriger un bouton vers une autre page lorsque jQuery est cliqué dessus?.

javascriptjqueryredirectbuttonclick
86
Ankur

Sans script:

<form action="where-you-want-to-go"><input type="submit"></form>

Mieux encore, puisque vous allez quelque part, présentez à l'utilisateur l'interface standard pour "aller quelque part":

<a href="where-you-want-to-go">ta da</a>

Bien que, le contexte sonne comme "Simuler une recherche normale où l'utilisateur soumet un formulaire", auquel cas la première option est la voie à suivre.

59
Quentin

c'est ce que tu veux dire?

$('button selector').click(function(){
   window.location.href='the_link_to_go_to.html';
})
180
Reigel
$('#someButton').click(function() {
    window.location.href = '/some/new/page';
    return false;
});
67
Darin Dimitrov

Avec Javascript simple:

<input type="button" onclick="window.location = 'path-here';">
19
Sarfraz

Dans votre html, vous pouvez ajouter un attribut de données à votre bouton:

<button type="submit" class="mybtn" data-target="/search.html">Search</button>

Ensuite, vous pouvez utiliser jQuery pour changer l’URL:

$('.mybtn').on('click', function(event) {
    event.preventDefault(); 
    var url = $(this).data('target');
    location.replace(url);
});

J'espère que cela t'aides

15
g-francesca

Vous pouvez utiliser:

  location.href = "newpage.html"

dans l'événement onclick du bouton.

9
Vincent Ramdhanie

Cela devrait marcher ..

$('#buttonID').click(function(){ window.location = 'new url'});
8
Gabriele Petrioli

Pas besoin de javascript, il suffit de l'envelopper dans un lien

<a href="http://www.google.com"><button type="button">button</button></a>
8
Owen

Vous pouvez utiliser window.location 

window.location="/newpage.php";

Ou vous pouvez simplement faire en sorte que le formulaire contenant le bouton de recherche ait une action de la page souhaitée.

6
PetersenDidIt

Vous pouvez utiliser ce code JavaScript simple pour créer un bouton de recherche permettant de créer un lien vers un exemple de page de résultats de recherche. Ici, j'ai redirigé vers '/ search' de ma page d'accueil. Si vous souhaitez effectuer une recherche à partir du moteur de recherche Google, vous pouvez utiliser " https://www.google.com/search " dans l'action de formulaire.

<form action="/search"> Enter your search text: 
<input type="text" id="searchtext" name="q"> &nbsp;
<input onclick="myFunction()" type="submit" value="Search It" />
</form> 
<script> function myFunction() 
{ 
var search = document.getElementById("searchtext").value; 
window.location = '/search?q='+search; 
} 
</script>
2
shus

Utilisez un lien et appelez-le comme un bouton:

<a href="#page2" class="ui-btn ui-shadow ui-corner-all">Click this button</a>
0
Redwolf

Il y a beaucoup de questions ici sur la redirection côté client, et je ne peux pas en dire plus sur la plupart d'entre elles… celle-ci est une exception.

La redirection n'est pas censée provenir du client… elle est censée provenir du serveur. Si vous n'avez aucun contrôle sur le serveur, vous pouvez certainement utiliser Javascript pour choisir une autre URL, mais ce n'est pas une redirection. La redirection s'effectue avec 300 codes d’état sur le serveur ou en sélectionnant la balise META en HTML.

0
Michael Blake

Et dans Rails 3 avec CoffeeScript à l'aide de JavaScript non intrusif (UJS):

Ajouter à assets/javascripts/my_controller.js.coffee:

$ ->
  $('#field_name').click ->
    window.location.href = 'new_url'

qui lit: lorsque l'événement document.ready est déclenché, ajoutez un événement onclick à un objet DOM dont l'ID est field_name et qui exécute le javascript window.location.href='new_url';

0
Tom Harrison Jr

owens fonctionne mais c’est pas du code HTML légal, techniquement, cette réponse n’est pas jQuery (mais jQuery étant un pseudocode préparé à l’avance - réinterprété sur la plateforme du client comme JavaScript natif - il existe vraiment est rien de tel que jQuery de toute façon)

 <button onclick="window.location.href='http://www.google.com';">Google</button>
0
Mr Heelis