Alle Kombinationsfelder in durchsuchbare Eingabefelder umwandeln

510
Alex

Websites und Webapps: Gibt es eine Methode / ein Addon / eine Software, mit der ich beliebige oder selektive Kombinationsfelder (dh Dropdown-Listen) auf einer Website in ein durchsuchbares Eingabefeld verwandeln kann.

Hintergrund: Viele ältere Admin-Interfaces haben wirklich lange Dropdown-Listen und es gibt keine Möglichkeit darin zu suchen. Wenn die Elemente nicht oder nur schlecht sortiert sind, kann man viel Glück finden.

2
Wie in den folgenden Kommentaren besprochen, ist die Greasemonkey-Lösung der richtige Weg, und sie wird niemals (!) Zwinkern und Dave wird zufällig überholt, bis die Browser- und / oder Betriebssystem-Software alle Kombinationsmöglichkeiten (aka select, aka Dropdown) Eingaben so durchsuchbar wie de facto Standard - was durchaus machbar ist, und ich kann darauf wetten, dass es irgendwann passieren wird (so wie die Eingaben für Kennwörter heutzutage speziell auf Betriebssystem- und Browserebene behandelt werden). Alex vor 9 Jahren 0

1 Antwort auf die Frage

1
Dave

Das hängt von der Situation ab, aber im Allgemeinen ist die Antwort, auch wenn man könnte, dass es sich nicht lohnt.

Sie können jedoch (zumindest auf einem Desktop - PC), geben, wenn die meisten Kombinationsfeld expaneded wird / ausgewählt, um einen Wert zu finden ... Wenn Sie den Besuch DHL - Website finden Sie eine Dropdown - Liste zu sehen. Klicken Sie auf die Liste, um die Optionen anzuzeigen. Wenn der Typ geöffnet ist United K(einschließlich Leerzeichen), werden Sie zu dem Element springen.

Einige Dropdown-Listen lassen dies nicht zu, wie z. B. diese Website . Die wahrscheinlichste verwendete Technologie wäre JavaScript. Ein GreaseMonkey-Skript könnte dazu beitragen, das Verhalten zu deaktivieren, so dass es sich um die Standard-HTML-Methode handelt.

Mit Dingen wie Greasemonkey können Sie den gerenderten HTML-Code beeinflussen und möglicherweise von einem Combox-Feld in ein Suchfeld konvertieren. Das Kombinationsfeld ist jedoch vorhersehbar! Wir wissen, welche Möglichkeiten wir haben und damit, was ausgewählt werden kann. Normalerweise codieren wir nicht gegen unerwartete Wertfehler, da es wahrscheinlich keine gibt! Dies kann bedeuten, dass das Eingeben von Wörtern, die nicht vorhanden sind, zu unerwartetem Verhalten führt.

Mit Web-Apps ist es möglicherweise komplizierter, da andere Technologien verwendet werden können ...

Natürlich kann jeder Browser auch anders reagieren, so dass es nicht wirklich möglich ist zu antworten, aber meine Antwort ist nein. Sie können nicht tun, was Sie wollen, ohne dass Sie Fehler machen (oder zumindest genau so arbeiten, wie Sie möchten) Website!

Beachten Sie, dass Ihr zweites Beispiel überhaupt keine Auswahl ist. Es handelt sich um ein benutzerdefiniertes Hacking-Steuerelement, das alle Arten von Usability-Richtlinien bricht. Wenn dieser Kodierer / Designer für mich arbeitete, würde er in den Holzschuppen gebracht. Brock Adams vor 9 Jahren 0
Ja .. das ist der Punkt, den ich gemacht habe. Das zweite Beispiel zeigt, dass einige Websites das Standardverhalten überschreiben und daher "nicht zulassen". Ich stimme zu, es ist eine schreckliche Designentscheidung, @BrockAdams. Dave vor 9 Jahren 0
Ich verstehe Ihren Punkt, aber ich denke, das OP möchte lieber eine Texteingabe + Liste haben, so dass die Eingabe als Filter fungiert. Das Codieren eines Benutzerskripts mit einer solchen Funktionalität ist auf jeden Fall möglich. ComFreek vor 9 Jahren 1
@ComFreek, aber mein zweiter Absatz legt dies nahe (oder vermisse ich immer noch den Punkt)? Dave vor 9 Jahren 0
Nette Gesprächsleute. Tatsächlich stimmt diese http://jqueryui.com/autocomplete/#combobox genau mit dem überein, was ich suche (klicken Sie auf Combobox auf der rechten Seite, wenn es nicht für Sie ausgewählt ist). Sie können das sehen: a. Sie können nicht vorhandene Elemente nicht auswählen. b. es wird teilweise übereinstimmen (kann sich in der Mitte des Elements befinden, c. es verwendet die darunter liegende Combobox (umschalten mit "show Below Select"). Jetzt muss ich nur noch ein greesemonkey-Skript finden oder es selbst schreiben. Alex vor 9 Jahren 1
@Alex, bitte beachten Sie, dass, wenn Sie JQuery dazu verwenden und die Website für Ihren Besuch eine andere Version von JQuery hat, viele Dinge leicht schief gehen können! Dave vor 9 Jahren 0
Ja, ich stimme zu und stimmt mit dem letzten Absatz Ihrer Antwort überein. Ich werde versuchen, eine Vanilla JS-Lösung zu finden, im schlimmsten Fall schreibe ich es selbst (etwas, das ich vermeiden wollte, und frage hier, ob jemand ein Werkzeug kennt, das dies tut). Alex vor 9 Jahren 0
Übrigens muss eine Lösung nicht universell sein und sollte mit einer Verknüpfung oder sogar nur für ausgewählte Kombinationsfelder aktiviert werden, anstatt für alles auf einer Seite / Ansicht. Alex vor 9 Jahren 0
Da Sie Greasemonkey ordnungsgemäß ausführen, können Sie jQuery-UI ohne Probleme verwenden, außer * für mögliche CSS-Kollisionen (geringfügiger Ärger). Verwenden Sie einfach @ @ required und stellen Sie sicher, dass Sie sich nicht im @ @ grant none-Modus befinden und es funktioniert einwandfrei. ... Ich habe schnell nach solchen Skripten gesucht. Nichts gefundenes lohnt sich. Ich schreibe selbst eins, wenn mich jemand nicht schlägt. Brock Adams vor 9 Jahren 1
/ Dave Sie haben erwähnt, dass "unerwartetes Verhalten" durch willkürliche Eingaben auftreten kann. Ich würde die Auswahl auf die ursprünglichen Auswahloptionen beschränken. Aber verzeihen Sie mir mein Picken. / Alex und / oder @BrockAdams: Planen Sie die Veröffentlichung hier? Ich wäre auch an einem solchen Userscript interessiert. ComFreek vor 9 Jahren 0
@ComFreek Tatsächlich beschränkt das Jqueryui (Link oben) die Auswahl auf die ursprünglichen (Quell-) Optionen. In Bezug auf die Veröffentlichung - wenn die Frage nicht blockiert ist. Alex vor 9 Jahren 0
Schreibte ein Skript, weiß aber nicht, ob es hier oder als neuer Beitrag in stackoverflow freigegeben werden soll Alex vor 9 Jahren 0
@Alex, poste es hier, da es nützlich sein kann. Oder löschen Sie diesen Beitrag und veröffentlichen Sie ihn erneut unter http://webapps.stackexchange.com/ (wo er zum Thema wird). Denken Sie daran, dass Sie Ihre eigene Frage auf den SO-Sites beantworten können :) Dave vor 9 Jahren 0
@Alex http://softwarerecs.stackexchange.com passt besser als Webapps.SE. ComFreek vor 9 Jahren 0

Verwandte Probleme