Wie erhalte ich ein Ereignis, wenn die ausgewählte Option die bereits ausgewählte Option eines Dropdown-Menüs ist?

9

Motivation:

Ich möchte ein select mit Werten aus einem AJAX-Aufruf dynamisch laden und dem Benutzer erlauben, das erste Element in der Liste auszuwählen, nachdem es geladen wurde, und nach Der Fokus wird jetzt erreicht, der erste Eintrag ist der ausgewählte Eintrag. Wenn Sie auf das Dropdown-Menü klicken und auf den ersten Eintrag klicken, passiert nichts. Ich kann keine Platzhalterelemente hinzufügen, die keine gültige Auswahl sind.

Frage:

Wie wird das Ereignis .change in jQuery ausgelöst, wenn die aktuell ausgewählte Option erneut ausgewählt / nicht geändert wird?

Gegeben ist Folgendes:

%Vor%

Angenommen, die Option one ist ausgewählt und ich klicke auf das Dropdown-Menü und wähle erneut one aus. Welches Ereignis wird ausgelöst?

%Vor%

Der obige Code funktioniert, wenn ich etwas anderes auswähle, aber wenn ich die aktuell gewählte Option auswähle, passiert nichts.

Mit anderen Worten:

Wenn ich auf das Drop-down-Menü klicke und "select" die aktuell ausgewählte Option auswähle, wie kann ich ein Ereignis auslösen?

Nicht Antworten:

Alle diese Vorschläge zu trigger sind keine Lösungen. Ich brauche etwas, das ausgelöst wird, wenn ich <%> auf Option 1 mit der Maus klicke, wenn Option 1 bereits der ist ausgewählte Option.

Ich habe versucht, mit .click und nichts passiert dann auch.

Keine der Antworten ist eine funktionierende Lösung für den Anwendungsfall des allerersten Mal das Dropdown ausgewählt ist, und jemand wählt die standardmäßig ausgewählte Option aus. Nichts passiert.

focusout ist keine Lösung, es passiert erst, wenn jemand irgendwo anders klickt, was zu spät ist.

    
Jarrod Roberson 13.05.2013, 01:11
quelle

5 Antworten

1

Arbeitslösung:

Zuerst müssen Sie das erste Element explizit auf einen selected -Zustand setzen.

%Vor%

Dann müssen Sie in Ihrem JavaScript das Attribut selected explizit entfernen.

%Vor%

Dies wird dann ein leeres / leeres Dropdown-Feld bei der Initialisierung anzeigen. Dadurch können Sie das erste Element in der Liste auswählen, wenn Sie das Dropdown-Menü zum ersten Mal anklicken, da% option das Attribut selected nicht mehr besitzt.

Dies hat den Vorteil, das Aussehen einer leeren Platzhalterauswahl zu haben, ohne tatsächlich eine haben zu müssen und die ganze gewundene Logik schreiben zu müssen, wenn sie ausgewählt wird.

CodePen Arbeitsbeispiel der Lösung. Seien Sie sicher und lassen Sie Ihre JavaScript-Debug-Konsole geöffnet, bevor Sie auf den Link klicken oder Sie werden den gewünschten Effekt nicht sehen.

Dies löst immer noch nicht das Reselection Problem, das so viele andere Leute gefragt haben, welches ein ähnliches Problem ist, das ich als refresh Mechanismus verwenden möchte , aber ich werde das in einer anderen Frage angehen.

    
Jarrod Roberson 13.05.2013, 02:34
quelle
1

Sie können das Klickereignis oder den Fokus verwenden. Click-Ereignis funktioniert nicht, wenn der Benutzer nur Tastatur wie Tab + Enter verwendet, aber der Fokus funktioniert.

Bearbeiten:

Eine Demo hinzugefügt: Ссылка Klicken funktioniert, auch wenn Sie auf ein ausgewähltes Element klicken.

%Vor%

Chrome erhält nur einen Klick (den gewünschten), aber FF erhält zwei Klicks, einen Klick beim Öffnen der Auswahl und einen weiteren beim Auswählen.

    
Scoup 13.05.2013 01:18
quelle
0

Der beste Weg, den ich gefunden habe, ist die Verwendung der Option click event

%Vor%

Es wird aufgerufen, egal was zuvor ausgewählt wurde. Und es wird nicht versaut, was als ausgewählte Option in Ihrem Select-Steuerelement angezeigt wird (was passieren wird, wenn Sie es mit removeAttr ('selected')) aufheben

    
ejectamenta 02.06.2016 17:52
quelle
-1

Verwenden Sie die Funktion .trigger() , um benutzerdefinierte Ereignisse für Elemente auszulösen.

%Vor%

Auf diese Weise können Sie das change -Ereignis für ein Element mit der ID yourelementid

auslösen

Jetzt möchten Sie, dass dies geschieht, wenn Sie auf das Dropdown-Menü klicken und das vorherige Element auswählen. Hinzufügen eines Click-Ereignisses sollte es tun.

%Vor%     
Starx 13.05.2013 01:16
quelle
-1

Versuchen Sie Folgendes:

%Vor%     
meda 13.05.2013 01:18
quelle