jQuery: ein-und ausblenden, ein input-element
Ich versuche zu tun, ist verbergen/anzeigen von einem bestimmten input-Objekt, wenn Sie einen Wert auswählen, der geprüft wird.
Den HTML-Teil des Codes ist hier:
<label for="add_fields_placeholder">Placeholder: </label>
<select name="add_fields_placeholder" id="add_fields_placeholder">
<option value="50">50</option>
<option value="100">100</option>
<option value="Other">Other</option>
</select>
<div id="add_fields_placeholderValue">
Price:
<input type="text" name="add_fields_placeholderValue" id="add_fields_placeholderValue">
</div>
Und der jQuery Teil ist hier:
$(document).ready(function()
{
$("#add_fields_placeholder").change(function() {
if($(this).val() == "Other") {
$("#add_fields_placeholderValue").show();
}
else {
$("#add_fields_placeholderValue").hide();
}
});
});
Also, wenn Benutzer wählt "Andere", zeigt er ein weiteres input-Objekt.
Das problem ist jetzt dies. Ersten beim öffnen der Seite die erste option ist standardmäßig aktiviert und die optionale Eingabe-Objekt dargestellt. Es versteckt sich, sobald Sie eine andere option auswählen.
Gibt es irgendeinen trick, um es zu verstecken, beim ersten laden der Seite auch? Nicht nur wenn Sie einen Wert manuell ein.
Danke Jungs.
Du musst angemeldet sein, um einen Kommentar abzugeben.
Nur hinzufügen:
Nachdem Sie Ihre change-Ereignis Erklärung über die Seite zu laden.
d.h.
Beispiel: http://jsfiddle.net/bZXYR/
Können Sie css verwenden, um es zu verbergen zunächst
http://jsfiddle.net/FarVX/20/
Außerdem haben Sie mehrere Elemente mit der gleichen id(hingewiesen von Brandon), das gilt nicht
Ich in der Regel Faktor ein - /ausblenden Logik:
und nennen es, wenn die Seite geladen wird.
aber ich wäre neugierig zu sehen, was andere Leute in der Regel tun.
Können Sie einfach tun Sie es mit CSS:
Ändern Sie die ID hier:
da Sie bereits verwenden, hier
und fügen Sie dieses css:
wenn Sie ändern die anonyme Methode in eine aufrufbare Funktion, die Sie sollten in der Lage sein, es zu nennen, auf Ready()
z.B.
Platzieren Sie den folgenden code unter der Platzhalter-Elemente:
Tut es in der ready-handler induzieren kann 'blinken' des Elements in bestimmten Umständen:
Funkeln, wenn der Anruf hide() auf dem Dokument bereit