Meine Bedürfnisse: Ich verwende einen jquery modalen Dialog. Ich habe einige Knöpfe darauf. Ich möchte eine Schaltfläche deaktivieren, wenn das Dialogfeld geöffnet wird, aber nach einer bestimmten Operation aktiviert werden soll.
Was ich getan habe: Ich kann die Schaltfläche deaktivieren, indem ich diese Anweisung jQuery(".ui-dialog-buttonpane button:contains('Issue')").attr("disabled", true).addClass("ui-state-disabled");
hinzufüge.
Problem: Aber jetzt möchte ich, dass wenn die Schaltfläche "Bearbeiten" angeklickt wird, eine Aktion ausgeführt wird, nachdem diese Aktion ausgeführt wurde, wird die Schaltfläche "Problem" aktiviert.
Mein Code ist unten.
%Vor% Es gibt keinen Grund, sich mit den Klassen auf den Knöpfen herumzuschlagen und es ist wahrscheinlich sowieso keine gute Idee. Die Schaltflächen in einem jQuery-UI-Dialogfeld sind jQuery-UI-Schaltflächen und sie unterstützen die Methoden disable
und enable
in der Regel jQuery-UI-Stil:
Ersetzen Sie zunächst Folgendes:
%Vor%Damit:
%Vor%Führen Sie dann in Ihrem Bearbeitungshandler Folgendes aus:
%Vor%Um die Schaltfläche zu aktivieren.
Soweit die Selektoren gehen, hat der Hauptdialog <div>
eine ui-dialog
-Klasse, also beginnen wir mit .ui-dialog
. Dann wollen wir die Knöpfe im Dialog, also suchen wir nach <button>
elements; Das gibt uns .ui-dialog button
. Die Schaltflächen im Dialogfeld werden von links nach rechts in derselben Reihenfolge aufgelistet wie in der Option buttons
für den Dialog. Es gibt verschiedene Möglichkeiten, die erste Schaltfläche zu erhalten:
Ich ging mit :nth-child
, einem CSS3-Selektor:
Die Pseudo-Klassenschreibweise
:nth-child(an+b)
stellt ein Element mitan+b-1
Geschwister vor im Dokumentbaum dar, für jede positive ganze Zahl oder den Nullwert vonn
, und hat ein Elternelement Element.
Also button:nth-child(1)
ist die erste Schaltfläche. Ich dachte mir, wenn du Dinge mit einem Button machst, würdest du wahrscheinlich Dinge mit anderen Buttons machen, zum Beispiel könntest du .ui-dialog button:nth-child(2)
machen, um den "Edit" -Button zu bekommen, und das würde gut mit dem Selektor zusammenpassen verwendet für die Schaltfläche "Problem".
Sie könnten tun:
%Vor% Denken Sie daran, dass ein Eingabeelement mit dem Attribut disabled immer deaktiviert ist, unabhängig vom Wert, auf den Sie das Attribut setzen: $('input').attr('disabled', false)
ist gleich $('input').attr('disabled', 'disabled')
wenn Sie auf diese Weise andere Dialoge im Kontext haben %Code% kann ein Problem verursachen.
Es gibt ein paar Schritte, um dies zu verbessern: 1.: Finde den Dialog-Handle
%Vor%2.: Finden Sie das Tastenfeld
%Vor%3.: Suchen Sie die Zielschaltfläche. Nehmen Sie an, der Name der Schaltfläche lautet BTN
%Vor%zuletzt: handle es (zB: deaktiviere es, aktiviere es);
%Vor%offensiv, wir wollen unseren Dialog Button Status beim Öffnen initiieren, dies funktioniert find:
%Vor%Tags und Links jquery jquery-ui modal-dialog jquery-ui-dialog