How to make a button redirect to another page using jQuery or just Javascript

Question

I am making a prototype and I want the search button to link to a sample search results page.

How do I make a button redirect to another page when it is clicked using jQuery or plain JS.

Answer 1

is this what you mean?

$('button selector').click(function(){
   window.location.href='the_link_to_go_to.html';
})

Answer 2

$('#someButton').click(function() {
    window.location.href = '/some/new/page';
    return false;
});

Answer 3

Without script:

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

Better yet, since you are just going somewhere, present the user with the standard interface for "just going somewhere":

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

Although, the context sounds like "Simulate a normal search where the user submits a form", in which case the first option is the way to go.

Answer 4

In your html, you can add data attribute to your button:

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

Then you can use jQuery to change the url:

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

Hope this helps

Answer 5

使用简单的 Javascript：

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

Answer 6

不需要 javascript，只需将它包装在一个链接中

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

Answer 7

You can use:

  location.href = "newpage.html"

in the button's onclick event.

Answer 8

这应该有效..

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

Answer 9

You can use window.location

window.location="/newpage.php";

Or you can just make the form that the search button is in have a action of the page you want.

Answer 10

这是最快（最易读，最简单）的方法，Owens可以工作，但它不是合法的 HTML，从技术上讲，这个答案不是 jQuery（但由于 jQuery 是预先准备好的伪代码 - 在客户端平台上重新解释为原生 JavaScript -真的是在jQuery没有这样的事情反正）

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

Answer 11

You can use this simple JavaScript code to make search button to link to a sample search results page. Here I have redirected to '/search' of my home page, If you want to search from Google search engine, You can use " https://www.google.com/search " in form action.

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

Answer 12

来自 YT 2012 代码。

<button href="/signin" onclick=";window.location.href=this.getAttribute('href');return false;">Sign In</button>

Answer 13

And in Rails 3 with CoffeeScript using unobtrusive JavaScript (UJS):

Add to assets/javascripts/my_controller.js.coffee :

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

which reads: when the document.ready event has fired, add an onclick event to a DOM object whose ID is field_name which executes the javascript window.location.href='new_url';

Answer 14

There are a lot of questions here about client side redirect, and I can't spout off on most of them…this one is an exception.

Redirection is not supposed to come from the client…it is supposed to come from the server. If you have no control over the server, you can certainly use Javascript to choose another URL to go to, but…that is not redirection. Redirection is done with 300 status codes at the server, or by plying the META tag in HTML.

Answer 15

使用链接并将其设置为按钮样式：

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