jQuery Redirect basiert auf zwei Dropdowns

Ich habe einige Probleme mit einem Suchformular, das ich auf der Grundlage von zwei Dropdown erstellt. Ziemlich einfach, aber ich kann das Problem nicht finden. Ich bin immer noch ziemlich grün.jQuery Redirect basiert auf zwei Dropdowns

Hier ist die html:

<form id="CustomSearch"> 
<select id="Location"> 
    <option value='northeast'>North East</option> 
    <option value='west'>West</option> 
    <option value='midwest'>Mid West</option> 
    <option value='south'>South</option> 
</select> 

<select id="Style"> 
    <option value='industrial'>Industrial</option> 
    <option value='farmhouse'>Farmhouse</option> 
    <option value='contemporary'>Contemporary</option> 
    <option value='beach+style'>Beach Style</option> 
    <option value='traditional'>Tradtional</option> 
</select> 

<button id="DropSearch">

Hier ist die js:

var location = jQuery('#Location').val(); 
var style = jQuery('#Style').val(); 

jQuery(document).ready(function(){ 
    jQuery('#DropSearch').click(function (e){ 
     jQuery.post('http://showroomworldwide.com/?geodir_search=1&stype=gd_place&s=' + location + '&stype=gd_place&s=' + style); 
    }); 
});

Wenn das Skript in die Fußzeile der Website hinzugefügt wird, erhalte ich eine nicht enden wollenden Schleife , fast so, als ob die Funktion ausgelöst würde, bevor sie tatsächlich auf den Knopf geklickt hat.

Quelle

2016-11-14 Adrian Reyes

Eines bemerke ich: 'var location = jQuery ('# Location'). Val(); var style = jQuery ('# Style'). Val(); 'müssen innerhalb Ihrer' .click' Event-Funktion sein, sonst stellen sie immer den Wert dar, den die Dropdowns hatten, als die Seite gerendert wurde, nicht den Wert in der zeigen, wenn der Benutzer auf die Schaltfläche geklickt hat. – ADyson

Versuchen Sie $ anstelle von jQuery mit @ADyson Kommentar oben ist wahr! –

BTW, senden Sie Anfrage, aber nichts mit reagieren. Können Sie eine Beispielseite mit diesem Problem anzeigen? – br3t

Es gibt keine Notwendigkeit von dem, was ich sehen kann, um eine POST-Anfrage zu machen - einfach window.location.href auch Ihre jQuery in eine IIFE wickeln und $ als Argument übergeben kann eine praktische Möglichkeit, Ihnen $ zur Verfügung zu stellen, wenn Sie müssen Verwenden Sie jQuery im Noconflict-Modus.

Schließlich, wie @ADyson erwähnt, müssen Sie die Position und den Stil des Abrufs im Event-Handler festlegen, sonst bleiben Sie bei den Anfangswerten hängen.

(function($){ 
     $(document).ready(function(){ 
      var location = $('#Location').val(); 
      var style = $('#Style').val(); 
      $('#DropSearch').click(function (e){ 
       window.location.href = 'http://showroomworldwide.com/?geodir_search=1&stype=gd_place&s=' + location + '&stype=gd_place&s=' + style; // Can't just reference location.href due to local variable 
      }); 
     }); 
}(jQuery));

Quelle

2016-11-14 22:49:22 Brian

jQuery Redirect basiert auf zwei Dropdowns

Antwort

Verwandte Themen