Beibehaltung der dropdown-Auswahl auf Seite neu laden

Ich habe eine select-Liste auf eine Seite wie diese:

<select name='elements'>
    <option value='water'>Water</option>
    <option value='fire'>Fire</option>
    <option value='air'>Air</option>
</select>

BEARBEITEN: Wenn ein Benutzer eine Auswahl vornimmt, wird die aktuelle Seite aktualisiert wird, aber wie halte ich die Auswahl des Benutzers in der Liste sichtbar nach der Aktualisierung der Seite? In anderen Worten, ich will nicht die Liste zurücksetzen auf die Standardeinstellungen ausgewählten Wert.

Hilfe bitte

  • Gibt es einen Grund, Sie möchten eine vollständige Aktualisierung der Seite? warum nicht einfach ein - /ausblenden/Auffüllen von der einen asynchronen Aufruf...?
  • Ich will übersetzen Sie den Inhalt der gesamten Seite in eine andere Sprache, also ja, ich möchte eine ganze Seite aktualisieren
InformationsquelleAutor user765368 | 2012-06-07
  1. 4

    Hier ist eine Javascript-only-Lösung.

     <select name='elements' id='elements' onChange='window.location="yoururl.html?value=" + this.value;'>
     <option value='water'>Water</option>
     <option value='fire'>Fire</option>
     <option value='air'>Air</option>
 </select>

    Dann verwenden Sie diese - Funktion, um zu sehen, wenn die value parameter gesetzt ist und Sie es bekommen und Sie können Sie verwenden jQuery, um es als selected.

    $("#elements option[value='" + result_of_gup + "']").attr("selected","selected") ;
    InformationsquelleAutor sachleen
  2. 3
     <select name='elements' onChange='window.location="yoururl.php?value=" + this.value;'>
     <option value='water'>Water</option>
     <option value='fire'>Fire</option>
     <option value='air'>Air</option>
 </select>
    • Was ist mit den keeping the user's selection visible in the list?
    • Sie befürchten, dass auf die yoururl.php?value=fire Seite, so lange wie Sie eine neue Seite laden mit dem querystring, verwenden Sie einfach den Wert zum Rendern der neuen Seite entsprechend.. Vorauswahl ein Element in einer Liste nur tun <option value="" selected></option>. Auch, Sie werden kaum eingestellt-code, so ist es schwer zu sagen, was Sie wirklich benötigen, erreicht.
    InformationsquelleAutor Control Freak
  3. 0

    Tun es, ohne jQuery:

    Erstellen window.location.getParameter() - Funktion (siehe hier von Anatolij Mironov) dann:

    <select name='elements' id='elements' onChange='window.location="yoururl.html?elements=" + this.selectedIndex;'>
   <option value='water'>Water</option>
   <option value='fire'>Fire</option>
   <option value='air'>Air</option>
</select>

<script type="text/javascript">
  els = document.getElementById('elements');
  selIndex = window.location.getParameter('elements') || 0;
  els[selIndex].selected = true;​
</script>

    Für eine einfache Referenz, ich reproduzieren Anatoly ausgezeichnete .getParameter Funktion unten:

    window.location.getParameter = function(key) {
    function parseParams() {
        var params = {},
            e,
            a = /\+/g,  //Regex for replacing addition symbol with a space
            r = /([^&=]+)=?([^&]*)/g,
            d = function (s) { return decodeURIComponent(s.replace(a, " ")); },
            q = window.location.search.substring(1);

        while (e = r.exec(q))
            params[d(e[1])] = d(e[2]);

        return params;
    }

    if (!this.queryStringParams)
        this.queryStringParams = parseParams(); 

    return this.queryStringParams[key];
};
    InformationsquelleAutor BooDooPerson
Schreibe einen Kommentar