So leiten Sie eine Schaltfläche mit jQuery oder einfach nur Javascript auf eine andere Seite um

Ich mache einen Prototyp und möchte, dass die Suchschaltfläche auf eine Beispielsuchergebnisseite verweist.

Wie leite ich eine Schaltfläche auf eine andere Seite um, wenn mit jQuery oder einfachem JS darauf geklickt wird?

Ohne Skript:

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

Besser noch, da Sie nur irgendwohin gehen, präsentieren Sie dem Benutzer die Standardschnittstelle für "nur irgendwohin gehen":

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

Der Kontext klingt zwar wie "Simulieren Sie eine normale Suche, bei der der Benutzer ein Formular sendet". In diesem Fall ist die erste Option der richtige Weg.

ist es das was du meinst?

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

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

In Ihrem HTML-Code können Sie Ihrer Schaltfläche Datenattribute hinzufügen:

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

Dann können Sie jQuery verwenden, um die URL zu ändern:

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

Hoffe das hilft

Mit einfachem Javascript:

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

Sie können verwenden:

  location.href = "newpage.html"

im Onclick-Ereignis der Schaltfläche.

Kein Javascript erforderlich, einfach in einen Link einbinden

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

Das sollte funktionieren ..

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

Sie können window.location verwenden

window.location="/newpage.php";

Oder Sie können einfach festlegen, dass das Formular, in dem sich die Suchschaltfläche befindet, eine Aktion der gewünschten Seite enthält.

Mit diesem einfachen JavaScript-Code können Sie eine Suchschaltfläche zum Verknüpfen mit einer Beispielsuchergebnisseite erstellen. Hier habe ich zu "/ search" meiner Startseite weitergeleitet. Wenn Sie über die Google-Suchmaschine suchen möchten, können Sie " https://www.google.com/search " in Formularaktion verwenden.

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

Ab YT 2012 Code.

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

Dies ist der SCHNELLSTE (am besten lesbare, am wenigsten komplizierte) Weg, Owens funktioniert, aber es ist kein legaler HTML- Code. Technisch gesehen ist diese Antwort nicht jQuery (aber da jQuery ein vorbereiteter Pseudocode ist - auf der Client-Plattform als natives JavaScript neu interpretiert - es wirklich ist nicht so etwas wie jQuery sowieso)

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

Und in Rails 3 mit CoffeeScript mit unauffälligem JavaScript (UJS):

Hinzufügen zu assets/javascripts/my_controller.js.coffee:

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

Dies lautet: Wenn das Ereignis document.ready ausgelöst wurde, fügen Sie onclickeinem DOM-Objekt ein Ereignis hinzu, dessen ID field_namedas Javascript ausführtwindow.location.href='new_url';

Hier gibt es viele Fragen zur clientseitigen Weiterleitung, und ich kann die meisten nicht ansprechen. Dies ist eine Ausnahme.

Die Umleitung soll nicht vom Client kommen, sondern vom Server. Wenn Sie keine Kontrolle über den Server haben, können Sie sicherlich Javascript verwenden, um eine andere URL auszuwählen, zu der Sie wechseln möchten, aber… das ist keine Umleitung. Die Umleitung erfolgt mit 300 Statuscodes auf dem Server oder durch Anwenden des META-Tags in HTML.

Verwenden Sie einen Link und gestalten Sie ihn wie eine Schaltfläche:

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