Wie erstelle ich html Element sieht aus wie “deaktiviert”, aber Werte übergeben?

Reicht es nicht, dass sie sich auf das Element konzentrieren, die einzige Option sehen und dann akzeptieren, dass es nur eine Option gibt? Wenn sie mit dem Element nichts anfangen können, verwenden Sie einfach ein normales input mit einer readonly -Attribut oder eine versteckte Eingabe.

7. Oktober 2012 um 14:27 Uhr

Wenn es nur eine Option gibt, warum muss es dann im Formular sein? Beachten Sie auch, dass ein nicht ahnungsloser Benutzer den Auswahlwert leicht ändern kann.

7. Oktober 2012 um 14:27 Uhr

@WebnetMobile.com: Gerne, aber ich weiß nicht, was es ist

7. Oktober 2012 um 14:28 Uhr

@ EL2002, es hört sich so an, als ob Sie sich auf das Formular verlassen, um einen bestimmten Wert zurückzugeben, den Sie benötigen. Haben Sie daran gedacht, dass der Benutzer jeden Wert in diesem -Element senden kann? Überprüfen Sie immer Ihr Formular. Wenn es nur einen möglichen Wert gibt, sollte es Ihnen egal sein: Das Programm würde es sowieso automatisch auffüllen, weil es keine anderen Werte auswählen sollte! – Anfänger 7. Oktober 2012 um 14:32 Uhr Es gibt Zeiten, in denen die Anfrage des OP ein absolut wünschenswertes Verhalten ist. z.B. Wenn normalerweise viele Optionen verfügbar sind, aber eine Kombination anderer Auswahlmöglichkeiten auf dem Formular nur eine bestimmte Auswahl zulässt. Das Auswählen der Option und das Deaktivieren der Steuerung wäre anderen Javascript-Spielereien weit überlegen. – Chris Rogers 1. Juli 2015 um 23:10 Uhr <img decoding="async" src="https://www.gravatar.com/avatar/a0e0c1744b0992a69b9f557b5d14d8ce?s=64&amp;d=identicon&amp;r=PG" alt="Benutzer-Avatar" width="32" height="32" class="bar-sm" title="Wie erstelle ich html Element sieht aus wie &quot;deaktiviert&quot;, aber Werte &#xFC;bergeben? 2">Tomaro Sie können es wie gewünscht deaktiviert lassen und dann das deaktivierte Attribut entfernen, bevor das Formular gesendet wird. $('#myForm').submit(function() { $('select').removeAttr('disabled'); }); Beachten Sie, dass Sie diese Methode auch programmgesteuert deaktivieren sollten, wenn Sie sich auf diese Methode verlassen, denn wenn JS deaktiviert ist oder nicht unterstützt wird, bleiben Sie bei der deaktivierten Auswahl hängen. $(document).ready(function() { $('select').attr('disabled', 'disabled'); }); es scheint die einzige lösung zu sein. – El Dude 7. Oktober 2012 um 14:49 Uhr @ EL2002 Wenn Sie wirklich nicht mit dem Auswahlverhalten zufrieden sind, wenn es nur eine Option enthält, dann wäre die einzige andere Lösung, die ich mir vorstellen kann, die Verwendung von CSS, um ein deaktiviertes Aussehen zu imitieren, wie Praveen vorgeschlagen hat – Tomaro 7. Oktober 2012 um 14:55 Uhr Wenn Sie es deaktiviert lassen, können Benutzer die Daten nicht übermitteln. Ist das in Ordnung für dich? – Praveen Kumar Purushothaman 7. Oktober 2012 um 14:58 Uhr Es verstößt strikt gegen die HTML-Standards, wenn ein deaktiviertes Formularfeld beim Absenden des Formulars eingefügt wird – Tomaro 7. Oktober 2012 um 14:59 Uhr @EL2002 Ich folge nicht. Die obige Lösung sollte perfekt funktionieren. – Tomaro 7. Oktober 2012 um 15:22 Uhr <img decoding="async" src="https://i.stack.imgur.com/wxoL9.jpg?s=64&amp;g=1" alt="Benutzer-Avatar" width="32" height="32" class="bar-sm" title="Wie erstelle ich html Element sieht aus wie &quot;deaktiviert&quot;, aber Werte &#xFC;bergeben? 3">dingyuchi <select id="test" name="sel"> <option disabled>1</option> <option disabled>2</option> </select> oder Sie können jQuery verwenden $("#test option:not(:selected)").prop("disabled", true); Dies ist viel besser, da es vor dem Senden nicht deaktiviert werden muss. – cadrell0 3. Juni 2013 um 19:10 Uhr Beachten Sie, dass Sie hinzufügen müssen .not(":selected") bevor Sie die Eigenschaft festlegen, um das ausgewählte Element aktiviert zu lassen. – cadrell0 3. Juni 2013 um 19:24 Uhr Meine Lösung bestand darin, eine deaktivierte Klasse in CSS zu erstellen: .disabled { pointer-events: none; cursor: not-allowed; } und dann wäre Ihre Auswahl: <select name="sel" class="disabled"> <option>123</option> </select> Der Benutzer könnte keine Werte auswählen, aber der ausgewählte Wert würde trotzdem bei der Formularübermittlung weitergegeben. Auf diese Weise können Sie immer noch mit TAB zur Auswahl navigieren und dann die ausgewählte Option mit den Aufwärts-/Abwärtspfeiltasten der Tastatur ändern. – vadipp 15. März 2017 um 7:08 Uhr Auch IE unterstützt nicht pointer-eventskönnen Sie immer noch mit der Maus navigieren. – kxc 24. März 2017 um 9:23 Uhr Wenn Sie einen Standardwert für Ihre Auswahl angeben können, können Sie denselben Ansatz für nicht aktivierte Kontrollkästchen verwenden, die eine versteckte Eingabe vor dem eigentlichen Element erfordern, da diese keinen Wert veröffentlichen, wenn sie nicht aktiviert sind: <input type="hidden" name="myfield" value="default" /> <select name="myfield"> <option value="default" selected="selected">Default</option> <option value="othervalue">Other value</option> <!-- ... //--> </select> Dies wird tatsächlich den Wert “default” (offensichtlich ohne Anführungszeichen) posten, wenn die Auswahl durch Javascript (oder jQuery) deaktiviert ist oder sogar wenn Ihr Code den HTML-Code schreibt, der das Element selbst mit dem Attribut deaktiviert = “disabled” deaktiviert. <img decoding="async" src="https://www.gravatar.com/avatar/f0285ad1973e938e2d2f40254c247f6f?s=64&amp;d=identicon&amp;r=PG" alt="Benutzer-Avatar" width="32" height="32" class="bar-sm" title="Wie erstelle ich html Element sieht aus wie &quot;deaktiviert&quot;, aber Werte &#xFC;bergeben? 4">Praveen Kumar Purushothaman Klasse hinzufügen .disabled und benutze diese CSS: ​.disabled {border: 1px solid #999; color: #333; opacity: 0.5;} .disabled option {color: #000; opacity: 1;}​ Demo: http://jsfiddle.net/ZCSRq/ Praveen, danke, ich habe es bereits ausprobiert, es ist praktisch genug, aber “select” hat einen Pfeil, der die Liste öffnet, und es ist im deaktivierten Zustand grau. Und ist nicht aktiviert. – El Dude 7. Oktober 2012 um 14:43 Uhr Es tut mir leid. Aktualisierte die Antwort @ EL2002, bitte schauen Sie nach. – Praveen Kumar Purushothaman 7. Oktober 2012 um 14:57 Uhr Danke, aber es sieht nicht so aus, als wäre es deaktiviert, sorry =( – El Dude 7. Oktober 2012 um 15:10 Uhr <img decoding="async" src="https://graph.facebook.com/100000210350579/picture?type=large" alt="Benutzer-Avatar" width="32" height="32" class="bar-sm" title="Wie erstelle ich html Element sieht aus wie &quot;deaktiviert&quot;, aber Werte &#xFC;bergeben? 5">Benutzer3654478 Man könnte ein zusätzliches verstecktes Eingabeelement mit demselben Namen und Wert wie dem der deaktivierten Liste verwenden. Dadurch wird sichergestellt, dass der Wert in $_POST-Variablen übergeben wird. Z.B: <select name="sel" disabled><option>123</select> <input type="hidden" name="sel" value=123> Praveen, danke, ich habe es bereits ausprobiert, es ist praktisch genug, aber “select” hat einen Pfeil, der die Liste öffnet, und es ist im deaktivierten Zustand grau. Und ist nicht aktiviert. – El Dude 7. Oktober 2012 um 14:43 Uhr Es tut mir leid. Aktualisierte die Antwort @ EL2002, bitte schauen Sie nach. – Praveen Kumar Purushothaman 7. Oktober 2012 um 14:57 Uhr Danke, aber es sieht nicht so aus, als wäre es deaktiviert, sorry =( – El Dude 7. Oktober 2012 um 15:10 Uhr <img decoding="async" src="https://www.gravatar.com/avatar/?s=64&amp;d=identicon&amp;r=PG&amp;f=1" alt="Benutzer-Avatar" width="32" height="32" class="bar-sm" title="Wie erstelle ich html Element sieht aus wie &quot;deaktiviert&quot;, aber Werte &#xFC;bergeben? 6">Benutzer3290525 Wow, ich hatte das gleiche Problem, aber eine Codezeile löste mein Problem. Ich schrieb $last_child_topic.find( "*" ).prop( "disabled", true ); $last_child_topic.find( "option" ).prop( "disabled", false ); //This seems to work on mine Ich sende das Formular an ein PHP-Skript, dann druckt es den richtigen Wert für jede Option, während es vorher “null” war. Sag mir, ob das klappt. Ich frage mich, ob das irgendwie nur bei mir funktioniert. Hilfreich224 Nicht hilfreich28