Estou fazendo um protótipo e quero que o botão de pesquisa vincule a uma página de resultados de pesquisa de exemplo.
Como faço um botão redirecionar para outra página quando ele é clicado usando jQuery ou JS simples.
Estou fazendo um protótipo e quero que o botão de pesquisa vincule a uma página de resultados de pesquisa de exemplo.
Como faço um botão redirecionar para outra página quando ele é clicado usando jQuery ou JS simples.
Respostas:
Sem script:
<form action="where-you-want-to-go"><input type="submit"></form>
Melhor ainda, já que você está apenas indo a algum lugar, apresente ao usuário a interface padrão para "apenas ir a algum lugar":
<a href="where-you-want-to-go">ta da</a>
Embora, o contexto soe como "Simule uma pesquisa normal onde o usuário envia um formulário", caso em que a primeira opção é o caminho a percorrer.
method="POST"
).
É isto que você quer dizer?
$('button selector').click(function(){
window.location.href='the_link_to_go_to.html';
})
window.location
e não document.location
porque não é a forma canônica.
$('#someButton').click(function() {
window.location.href = '/some/new/page';
return false;
});
return false
, pressionar a tecla "Enter ou Return" pode apenas levá-lo ao url atual em vez de redirecionar para o novo link. Especialmente útil, quando você tem um controle de entrada de texto que gostaria de postar em uma url diferente ao pressionar a tecla Enter / Return.
Em seu html, você pode adicionar atributos de dados ao seu botão:
<button type="submit" class="mybtn" data-target="/search.html">Search</button>
Então você pode usar jQuery para alterar o url:
$('.mybtn').on('click', function(event) {
event.preventDefault();
var url = $(this).data('target');
location.replace(url);
});
Espero que isto ajude
Você pode usar:
location.href = "newpage.html"
no evento onclick do botão.
Isso deve funcionar ..
$('#buttonID').click(function(){ window.location = 'new url'});
Você pode usar window.location
window.location="/newpage.php";
Ou você pode simplesmente fazer com que o formulário em que está o botão de pesquisa tenha uma ação da página desejada.
Você pode usar este código JavaScript simples para fazer o botão de pesquisa vincular a uma página de resultados de pesquisa de amostra. Aqui eu redirecionei para '/ search' da minha página inicial. Se você quiser pesquisar no mecanismo de pesquisa do Google, pode usar " https://www.google.com/search " no formulário de ação.
<form action="/search"> Enter your search text:
<input type="text" id="searchtext" name="q">
<input onclick="myFunction()" type="submit" value="Search It" />
</form>
<script> function myFunction()
{
var search = document.getElementById("searchtext").value;
window.location = '/search?q='+search;
}
</script>
esta é a maneira MAIS RÁPIDA (mais legível, menos complicada) de fazer isso, Owens funciona, mas não é HTML legal, tecnicamente essa resposta não é jQuery (mas como jQuery é um pseudocódigo pré-preparado - reinterpretado na plataforma do cliente como JavaScript nativo - existe realmente é nenhuma coisa como jQuery de qualquer maneira)
<button onclick="window.location.href='http://www.google.com';">Google</button>
E no Rails 3 com CoffeeScript usando JavaScript não intrusivo (UJS):
Adicionar a assets/javascripts/my_controller.js.coffee
:
$ ->
$('#field_name').click ->
window.location.href = 'new_url'
que diz: quando o evento document.ready for disparado, adicione um onclick
evento a um objeto DOM cujo ID é o field_name
que executa o javascriptwindow.location.href='new_url';
Há muitas perguntas aqui sobre o redirecionamento do lado do cliente, e não posso responder sobre a maioria delas ... este é uma exceção.
O redirecionamento não deve vir do cliente ... deve vir do servidor. Se você não tem controle sobre o servidor, certamente pode usar Javascript para escolher outro URL para ir, mas ... isso não é redirecionamento. O redirecionamento é feito com 300 códigos de status no servidor ou por meio da inserção da tag META em HTML.
Use um link e estilize-o como um botão:
<a href="#page2" class="ui-btn ui-shadow ui-corner-all">Click this button</a>