Unterbrechen Sie die HTML-Bestätigung. Warn-, Eingabeaufforderungs- und Bestätigungsmethoden in JavaScript

In dieser Lektion lernen wir die Methoden „alert()“, „prompt()“ und „firmify()“ des Fensterobjekts kennen.

Alert()-Methode

Die Methode „alert()“ soll ein Warndialogfeld mit der angegebenen Meldung und einer Schaltfläche „OK“ auf dem Bildschirm des Benutzers anzeigen. Es kann verwendet werden, um dem Benutzer wichtige Informationen zu übermitteln.

window.alert(Parameter_1);

Die Methode „alert()“ verfügt über einen erforderlichen Parameter – dies ist der Text der Nachricht, die im Dialogfeld angezeigt wird. Diese Methode gibt als Ergebnis ihrer Ausführung nichts zurück.

Lassen Sie uns beispielsweise ein Warndialogfeld für einen Website-Besucher anzeigen, wenn dieser auf einen Link klickt: Gehen Sie zur Webseite

Methode „confirm()“ Die Methode „confirm()“ des Fensterobjekts dient dazu, auf dem Bildschirm des Benutzers ein Dialogfeld mit der angegebenen Meldung und den Schaltflächen „OK“ und „Abbrechen“ anzuzeigen. Über ein Bestätigungsfenster kann der Benutzer um Erlaubnis gebeten werden, eine bestimmte Aktion auszuführen.

var resultConfirm = bestätigen(Parameter_1);

Diese Methode hat einen Parameter – das ist der Text der Nachricht, der im Dialogfeld angezeigt wird.

Die Methode secure() gibt als Ergebnis ihrer Ausführung einen von zwei Werten zurück:

  • true, wenn der Benutzer auf „OK“ geklickt hat;
  • false, wenn der Benutzer auf „Abbrechen“ geklickt oder es geschlossen hat.

Lassen Sie uns beispielsweise im Element p mit id="resultConfirm" das Ergebnis anzeigen, wenn der Benutzer im Dialogfeld auf die Schaltfläche „OK“ klickt:

var resultActionUser = bestätigen("Benutzer, klicken Sie bitte auf die Schaltfläche OK."); if (resultActionUser) ( document.getElementById("resultConfirm").innerHTML = "Benutzer, vielen Dank, dass Sie auf die Schaltfläche OK geklickt haben"; ) else ( document.getElementById("resultConfirm").innerHTML = "Benutzer, wir sind von Ihrem enttäuscht Antwort "; )

prompt()-Methode

Die Methode prompt() soll auf dem Bildschirm des Benutzers ein Dialogfeld mit einer Nachricht, einem Textfeld zur Dateneingabe sowie den Schaltflächen „OK“ und „Abbrechen“ anzeigen. Es soll den Benutzer zur Eingabe von Daten auffordern.

var resultPrompt = prompt(Parameter_1, Parameter_2);

Diese Methode hat zwei Parameter:

  • Nachricht, die im Dialogfeld angezeigt wird. Dieser Parameter ist erforderlich und enthält eine Meldung, die „sagt“, welche Daten der Benutzer in das Textfeld eingeben soll;
  • Der zweite Parameter ist optional und kann verwendet werden, um den Anfangswert anzugeben, der beim Öffnen im Eingabefeld des Dialogfelds gedruckt wird.

Abhängig von den Aktionen des Benutzers kann die Methode prompt() die folgenden Daten zurückgeben:

  • Textwert – wenn das Eingabefeld Daten enthält und der Benutzer auf „OK“ geklickt hat;
  • leere Zeile – wenn das Eingabefeld keine Daten enthält und der Benutzer auf „OK“ geklickt hat;
  • null – Wenn der Benutzer auf „Abbrechen“ geklickt oder dieses Fenster geschlossen hat, spielt es keine Rolle, welche Daten in das Textfeld eingegeben wurden.

Hinweis: Das Dialogfeld, das als Ergebnis der Ausführung einer der Methoden „alert()“, „firmify()“ oder „prompt()“ erscheint, ist modal, d. h. Es blockiert den Zugriff des Benutzers auf die übergeordnete Anwendung (Browser), bis der Benutzer das Dialogfeld schließt.

Fragen wir den Benutzer beispielsweise nach einem Namen und zeigen je nach Ergebnis den Text im Element mit id="nameUser" an:

var nameUser = prompt ("Geben Sie Ihren Namen ein?"); if (nameUser) ( document.getElementById("nameUser").innerHTML = nameUser +", Willkommen auf der Site!"; ) else ( document.getElementById("nameUser").innerHTML = "Gast, willkommen auf der Site!" ; )

Bitten wir den Benutzer beispielsweise, die Zahl 8 zu erraten:

functiongueNumber() ( var findNumber = prompt ("Erraten Sie eine Zahl von 1 bis 10?"); switch (findNumber) ( case "6": alarm("Es ist schon wärmer!"); break; case "7": alarm ("Es ist heiß!"); break; case "8": alarm("Du hast richtig geraten! Es ist die Zahl 8."); break; case "9": warning("Es ist schon wärmer!"); break; default : alarm("Es ist kalt! "); break; ) ) ... Errate die Zahl

Ich habe über modale „Vorlagen“-Fenster gesprochen. Diese. diejenigen, für die separate Vorlagendateien erstellt werden. Und die Komplexität und Raffinesse dieser Fenster kann grenzenlos sein.

Um mit dem Benutzer zu kommunizieren, sind jedoch häufig sehr einfache Dialogfelder erforderlich. Zeigen Sie einfach eine Nachricht mit einem einzigen „Ok“-Button an, die ihm auffällt, oder bitten Sie ihn um die Bestätigung einer Aktion.

Zu diesem Zweck nutzen Websites häufig Systemfunktionen.
Es gibt mehrere Gruppen sogenannter „System“-Funktionen in der Engine. Die Dateien, die diese Funktionen enthalten, werden ganz am Anfang der Engine geladen, noch bevor die Konfigurationsdateien geladen werden, und die Funktionen selbst sind an kein Modul gebunden und können überall in jeder Komponente verwendet werden – in Modulen, Aktionen, Mappern, usw." class="term">Systemfunktionen Alert() ,Confirm() und Prompt() , etwa so:
Alles löschen!
Dies funktioniert in jedem Browser, aber die Fenster, die von solchen Funktionen angezeigt werden, sehen hässlich und primitiv aus und zerstören die ganze Schönheit, die wir auf unserer Website schaffen.

Um dieses Problem in der Engine zu lösen, können Sie jetzt (ich würde sagen, es ist notwendig) Analoga verwenden:

ls.modal.alert(options) – Zeigt ein Informationsfenster mit einer „OK“-Schaltfläche an
ls.modal.confirm(options) – zeigt ein Fenster mit den Schaltflächen „Abbrechen“ und „Bestätigen“ an
ls.modal.prompt(options) – Fenster mit einem Eingabefeld

In allen Funktionen kann der Optionsparameter entweder eine Zeichenfolge oder ein Objekt sein. Zum Beispiel:
ls.modal.alert(‘Hallo Welt!’);
Dieser Code zeigt ein modales Fenster mit dem Text „Hallo Welt!“ an. und die Schaltfläche „Ok“. Und was am wichtigsten ist: Dieses Fenster wird genauso gestaltet sein wie alle anderen modalen Fenster auf Ihrer Website.

Wir können auch einen Button-Click-Handler schreiben:
ls.modal.alert((Titel: „Ich sage“, Text: „Hallo Welt!“, onConfirm: function())( // der Benutzer hat auf die Schaltfläche „OK“ geklickt))); Hier wird der Fenstertitel „Ich sage“ hinzugefügt und beim Drücken der Schaltfläche wird die im Parameter onConfirm übergebene Funktion ausgeführt.

Aber das ist noch nicht alles! Wir können jeden HTML-Code im Hauptteil des Fensters anzeigen:
var htmlCode = " Hier ist Ihr neuer Avatar“; ls.modal.alert((title: „Avatar“, html: htmlCode)); Und wir bekommen so etwas:

Beachten Sie, dass der HTML-Parameter zum Anzeigen des HTML-Codes verwendet wird, nicht der Textparameter (wenn Sie beide Parameter übergeben, wird Text verwendet und HTML wird ignoriert).

Die Funktionen ls.modal.confirm() und ls.modal.prompt() werden auf ähnliche Weise verwendet. In diesen Funktionen sind jedoch zusätzliche Parameter möglich. Beispielsweise können wir in den Parametern der Funktion ls.modal.confirm() nicht einen, sondern zwei Handler übergeben – einen Handler für jede Schaltfläche:
ls.modal.confirm((Titel: „Löschen“, Text: „Alles löschen?“, onConfirm: function())( // der Benutzer hat auf die Schaltfläche „Bestätigen“ geklickt), onCancel: function())( // the Der Benutzer hat auf die Schaltfläche „Abbrechen“ geklickt ) )); Die Funktion ls.modal.prompt() wird verwendet, um den Benutzer zur Eingabe eines Werts aufzufordern. Und wir können dies als Standard festlegen:
ls.modal. prompt ((Titel: „Geben Sie eine Zahl ein“, Text: „Geben Sie hier eine Zahl ein“, Wert: 123 onConfirm: function(value)( // Eingegebener Wert in die Variable
Das allgemeine Schema für Variablennamen lautet wie folgt: Präfix+Zusatzpräfix+Variablenname+Suffix. Variablennamen enthalten Groß- und Kleinbuchstaben und beginnen mit einem Kleinbuchstaben-Präfix, das den Datentyp des Variablenwerts angibt. Die Liste der zur Verwendung empfohlenen Präfixe ist unten aufgeführt. Das zusätzliche Präfix gibt den Wert der Variablen an und wird aus der unten aufgeführten Liste empfohlener zusätzlicher Präfixe ausgewählt. Der Variablenname besteht aus einem oder mehreren Wörtern, die die semantische Bedeutung dieser Variable beschreiben, und wird in Groß-/Kleinschreibung geschrieben. Da Präfixe den Werttyp einer Variablen beschreiben, beschreibt ihr Name eine einzelne Instanz dieses Typs. Das Suffix ergänzt den Variablennamen und gibt dessen semantische Bedeutung an. Die Liste der zur Verwendung empfohlenen Suffixe ist unten aufgeführt. Zahlen im Namen sind erlaubt, aber nicht empfohlen. Der Unterstrich wird im Namen nicht verwendet.

Präfixe
Die folgende Liste von Präfixen wird zur Verwendung empfohlen:
- a (array) - Array-Wert;
- b (bool) – logischer Wert;
- e (Entity) – ein Objekt vom Typ Entity, das von diesem geerbt wurde;
- i (Ganzzahl) - ganzzahliger Wert;
- f (float) – Wert vom Typ Real;
- m (Mapper) – ein Objekt vom Typ Mapper und von ihm geerbt;
- n (Zahl) – ein Wert eines undefinierten digitalen Typs, der entweder eine Ganzzahl oder annehmen kann
echter Wert. Erfordert bei Verwendung eine Überprüfung des Typwerts.

- o (Objekt) – ein Objekt eines anderen Typs als Mapper und Entity;
- s (String) – String-Wert;
- x (miXed) – Objekt gemischten Typs. Erfordert bei Verwendung eine Überprüfung des Typwerts.

Die Verwendung der folgenden Liste zusätzlicher Präfixe wird empfohlen:
- Min (Minimum) – Mindestwert;
- Max (Maximum) - Maximalwert;
- Aktuell - aktueller Wert.

Suffixe
Im Gegensatz zu zusätzlichen Präfixen geben Suffixe die semantische Bedeutung des Variablennamens an, nicht seine
Bedeutung. Die folgende Liste von Suffixen wird zur Verwendung empfohlen:
- First – der erste Wert aus der verfügbaren Liste;
- Letzter – der letzte Wert aus der verfügbaren Liste;
- Limit – Grenzwert aus der verfügbaren Liste;
- Tmp – temporärer Wert;
- Neu – neuer (eingestellter) Wert;
- Alt – alter (überschriebener) Wert;

Ausnahmen
Es gibt Variablennamen, die für besondere Zwecke vorgesehen sind – Ausnahmen von den genannten
Empfehlungen:
– i, j – Iteratoren für kleine Schleifen (eine Schleife gilt als klein, wenn sie vollständig darauf passt
einen Bildschirm und ermöglicht es Ihnen, alle Vorkommen von Iteratoren gleichzeitig zu sehen);
- k, v - foreach-Schleifenvariablen ($aData as $k => $v);
– Schlüssel, Wert – foreach-Schleifenvariablen ($aData as $key => $value);
- s – serialisierte Datendarstellung;
- Daten – eine Variable mit Daten im Entity-Setter sowie Daten, die von Mapper-Methoden zurückgegeben werden;
- sql – in Mappern eine Variable, die den Abfragetext enthält – das Präfix „s“ wird nicht verwendet.“ class="term">variable „value“) )); Hier wird der vom Benutzer eingegebene Wert an den Handler übergeben und Wir können damit bestimmen, was als nächstes damit zu tun ist.

Zum Abschluss dieses Teils möchte ich die Aufmerksamkeit auf eine Besonderheit lenken, die nicht vergessen werden sollte: Es gibt einen wichtigen Unterschied im Verhalten der Systemfunktionen „alert()“, „confirm()“ und „prompt()“ und ihrer entsprechenden Analoga – ls.modal.alert( Optionen) , ls.modal.confirm(Optionen) und ls.modal.prompt(Optionen) . Nämlich - Systemfunktionen
Es gibt mehrere Gruppen sogenannter „System“-Funktionen in der Engine. Die Dateien, die diese Funktionen enthalten, werden ganz am Anfang der Engine geladen, noch bevor die Konfigurationsdateien geladen werden, und die Funktionen selbst sind an kein Modul gebunden und können überall in jeder Komponente verwendet werden – in Modulen, Aktionen, Mappern, usw.“ class="term">Systemfunktionen stoppen die Ausführung von Javascript-Code und warten auf die Reaktion des Benutzers. Und erst nachdem der Benutzer reagiert hat, wird die Codeausführung fortgesetzt. Wenn Sie die hier beschriebenen Funktionen verwenden, wird der gesamte Code, bei dem die Der eigentliche Aufruf wird zuerst ausgeführt und erst dann erscheint ein Dialogfenster.

Wenn Sie also den am Anfang des Artikels angegebenen Code nehmen und einfach den Bestätigungsaufruf () durch ls.modal.confirm() ersetzen, muss der Code etwa so umgeschrieben werden:
Alles löschen! $(function())( $("js-delete-all").click(ls.modal.confirm("Sind Sie sicher?", function()( location.href="site.com/delete/all/ "; ));); )); Bitte beachten Sie, dass die Handler-Funktion nicht im onConfirm-Parameter, sondern als zweites Argument der Funktion übergeben wird; dies ist ebenfalls akzeptabel.

Ja, es gibt etwas mehr Code. Aber es ist wunderschön! Und Schönheit erfordert, wie Sie wissen, Opfer.

Als Fortsetzung unserer Reihe von Tutorials zum Verschönern und Verwalten von Standardbrowsereinstellungen laden wir Sie heute ein, mit einem benutzerfreundlichen jQuery-Plugin einen browserübergreifenden Bestätigungsdialog zu entwickeln. Sie können Text, Schaltflächen und Aktionen auswählen, die nach einem Klick ausgeführt werden.

HTML Quelltext

Während wir uns zunächst auf das Bestätigungsfenster konzentrieren sollten, erzählen wir Ihnen zunächst etwas über die Seite, die wir verwenden werden. Wenn Sie den Quellcode des Plugins sehen möchten, können Sie diesen Schritt überspringen und nach unten zum jQuery-Teil des Artikels scrollen.

Index.php


Eine jQuery-Bestätigungsdialogersetzung mit CSS3 | Tutorialzine-Demo

Oben im Dokument haben wir die Schriftart Cuprum von jQuery.confirm.css (Cascading Style Sheets für das Dialogfeld) und Styles.css – die Cascading Style Sheets unserer Seite – eingefügt.

Ganz unten im Dokumentkörper haben wir die jQuery-Bibliothek jquery.confirm.js (die Haupt-Plugin-Datei) sowie script.js eingefügt, das auf das Schaltflächenklickereignis wartet und das Plugin ausführt. Im letzten Schritt unseres heutigen Tutorials werden wir Sie über diese beiden Dateien informieren.

Um ein Bestätigungsfenster in Ihre Website einzubinden, müssen Sie den Ordner jquery.confirm aus dem heruntergeladenen Archiv kopieren und jquery.confirm.css in den Kopf des Codes sowie die Datei jquery.confirm.js vor einfügen Tag, das den Hauptteil des Dokuments + jQuery-Bibliothek beendet.

Der Dialog selbst besteht lediglich aus ein paar Zeilen HTML-Code. Unten sehen Sie den vom Plugin eingefügten Code zur Anzeige des Dialogfelds.

Beispielcode für ein Dialogfeld

Der Code wird dem Hauptteil des Dokuments hinzugefügt. „confirmOverlay“ wird über dem Rest der Seite angezeigt, wodurch jegliche Interaktion mit Seitenelementen verhindert wird, während das Dialogfeld angezeigt wird. h1-, p- und div-ConfirmButtons sind entsprechend der in den Plugin-Einstellungen angegebenen Struktur angeordnet. Später im Artikel erfahren Sie mehr darüber.

CSS-Code

Das Design des Dialogfelds ist in der Datei jquery.confirm.css enthalten. Dies erleichtert die Integration in ein fertiges Projekt erheblich und das Styling erfolgt so, dass Sie sicher sein können, dass sich die Stile nicht mit den bereits auf der Seite vorhandenen Stilen vermischen.

jquery.confirm.css

#confirmOverlay(
Breite: 100 %;
Höhe: 100 %;
Position:fest;
oben:0;
links:0;
Hintergrund:url("ie.png");
Hintergrund: -moz-linear-gradient(rgba(11,11,11,0.1), rgba(11,11,11,0.6)) repeat-x rgba(11,11,11,0.2);
Hintergrund:-webkit-gradient(linear, 0 % 0 %, 0 % 100 %, from(rgba(11,11,11,0.1)), to(rgba(11,11,11,0.6))) repeat-x rgba(11,11,11,0.2);
Z-Index:100000;
}

#confirmBox(
Hintergrund: URL("body_bg.jpg") Repeat-X links unten #e5e5e5;
Breite:460px;
Position:fest;
links:50 %;
oben:50%;
Rand: -130px 0 0 -230px;
Rand: 1px solid rgba(33, 33, 33, 0,6);

Moz-box-shadow: 0 0 2px rgba(255, 255, 255, 0.6) inset;
-webkit-box-shadow: 0 0 2px rgba(255, 255, 255, 0.6) inset;
box-shadow: 0 0 2px rgba(255, 255, 255, 0.6) inset;
}

#confirmBox h1,
#confirmBox p(
Schriftart:26px/1 „Cuprum“, „Lucida Sans Unicode“, „Lucida Grande“, serifenlos;
Hintergrund: URL("header_bg.jpg") Repeat-X links unten #f5f5f5;
Polsterung: 18px 25px;
Textschatten: 1px 1px 0 rgba(255, 255, 255, 0,6);
Farbe:#666;
}

#confirmBox h1(
Buchstabenabstand: 0,3 Pixel;
Farbe:#888;
}

#confirmBox p(
Hintergrund: keiner;
Schriftgröße:16px;
Zeilenhöhe:1,4;
Polsterung oben: 35px;
}

#confirmButtons(
Polsterung:15px 0 25px;
text-align:center;
}

#confirmBox.button(
display:inline-block;
Farbe weiß;
Position:relativ;
Höhe: 33px;

Schriftart: 17px/33px „Cuprum“, „Lucida Sans Unicode“, „Lucida Grande“, serifenlos;

Rand rechts: 15px;
Polsterung: 0 35px 0 40px;
Textdekoration: keine;
Grenze:keine;
}

#confirmBox .button:last-child( margin-right:0;)

#confirmBox .button span(
Position:absolut;
oben:0;
rechts:-5px;
Hintergrund:url("buttons.png") no-repeat;
Breite: 5px;
Höhe: 33px
}

#confirmBox .blue( Hintergrundposition: links oben; Textschatten: 1 Pixel 1 Pixel 0 # 5889a2;)
#confirmBox .blue span( Hintergrundposition:-195px 0;)
#confirmBox .blue:hover( Hintergrundposition:links unten;)
#confirmBox .blue:hover span( background-position:-195px unten;)

#confirmBox .gray( Hintergrundposition:-200px oben;Textschatten:1px 1px 0 #707070;)
#confirmBox .gray span( Hintergrundposition:-395px 0;)
#confirmBox .gray:hover(background-position:-200px unten;)
#confirmBox .gray:hover span( background-position:-395px unten;)

Dies nutzt die Vorteile des neuen CSS3. In der #confirmOverlay-Definition verwenden wir CSS3-Abstufungen (die nur in Firefox, Safari und Chrome funktionieren) mit einem Fallback in Form eines transparenten PNG.

Als nächstes haben wir in der zentrierten #confirmBox-Anzeige einen inneren Kastenschatten hinzugefügt (ähnlich einem inneren Leuchten in Photoshop). Wir haben auch die Schriftart Cuprum verwendet, die aus dem Schriftartenverzeichnis von Google hinzugefügt wurde.

Zusammen mit den Textschatten können Sie den Schaltflächenstil sehen. Die Umsetzung erfolgt mittels Schiebetüren. Derzeit sind zwei Arten von Designs verfügbar – Blau und Grau. Sie können eine neue Schaltflächenfarbe hinzufügen, indem Sie dem Code neue Deklarationen hinzufügen.

jQuery

Bevor wir uns mit dem Quellcode des Plugins befassen, schauen wir uns zunächst etwas genauer an. In script.js können Sie sehen, wie das Plugin ausgeführt wird.

Script.js

$(document).ready(function())(

$(".item .delete").click(function())(

Var elem = $(this).closest(".item");

$.confirm((
„title“: „Bestätigung löschen“,
„message“: „Sie sind dabei, dieses Element zu löschen.
Eine spätere Wiederherstellung ist nicht möglich! Weitermachen?"
"Tasten" :(
"Ja" :(
„Klasse“: „blau“,
"Aktion": function())(
elem.slideUp();
}
},
"NEIN" :(
„Klasse“: „grau“,
"action": function()() // In diesem Fall gibt es nichts zu tun. Sie können die Aktionseigenschaft auch weglassen.
}
}
});

Wenn in unserem Beispiel auf div .deleted geklickt wird, führt das Skript die vom Plugin definierte Funktion $.confirm aus. Im Folgenden finden Sie den Titel, die Beschreibung und das Schaltflächenobjekt des Dialogfelds. Jede Schaltfläche verfügt über einen CSS-Klassennamen sowie einen Aktionsparameter. Eine Aktion ist eine Funktion, die ausgeführt wird, wenn auf eine Schaltfläche geklickt wird.

Kommen wir nun zum interessanten Teil. In jquery.confirm.js können Sie den Quellcode für unseren Dialog sehen.

Jquery.confirm.js

$.confirm = function(params)(

If($("#confirmOverlay").length)(
// Eine Bestätigung wird bereits auf der Seite angezeigt:
falsch zurückgeben;
}

Var buttonHTML = "";

// Generieren des Markups für die Schaltflächen:

If(!obj.action)(
obj.action = function())(;
}
});

Var-Markup = [
"

",params.title,"",
"

",params.message,"

",
"

",
buttonHTML,
"

"
].verbinden("");

$(markup).hide().appendTo("body").fadeIn();

Var Buttons = $("#confirmBox .button"),
ich = 0;

$.each(params.buttons,function(name,obj)(
Buttons.eq(i++).click(function())(

// Aufruf des Aktionsattributs, wenn a
// Klicken erfolgt und die Bestätigung wird ausgeblendet.

Obj.action();
$.confirm.hide();
falsch zurückgeben;
});
});
}

$.confirm.hide = function())(
$("#confirmOverlay").fadeOut(function())(
$(this).remove();
});
}

Unser Plugin definiert eine $.confirm()-Methode. Diese Methode verarbeitet die von Ihnen eingegebenen Daten, erstellt das Markup und fügt dann alles der Seite hinzu. Da das #confirmOverlay-Div über die CSS-Deklaration eine feste Position hat, überlassen wir die Zentrierung dem Browser und das anschließende Verschieben, während der Benutzer auf der Seite scrollt.

Nach dem Hinzufügen des Markups verteilt das Skript Ereignishebel für Schaltflächenklickereignisse und führt die Aktion aus, die der gedrückten Schaltfläche entspricht.

Damit ist unser Dialogfenster abgeschlossen!

Fassen wir zusammen

Sie können das Erscheinungsbild des Dialogfelds mithilfe der Datei jquery.confirm.css bearbeiten. Da das Nachrichtenattribut im Dialogfeld HTML-Code verwendet, können Sie dort Bilder oder Symbole hinzufügen.

Sie können sogar ein Plugin verwenden, um Fehlermeldungsfelder zu implementieren – Sie müssen lediglich eine einzelne Schaltfläche hinzufügen, ohne dass ein Aktionsattribut festgelegt ist.

Aufmerksamkeit! Sie sind nicht berechtigt, ausgeblendeten Text anzuzeigen.

Und noch einmal begrüße ich Sie zu einem weiteren Thema, das der JavaScript-Sprache gewidmet ist, in dem wir die Alert-, Prompt- und Confrim-Methoden analysieren werden. Diese Methoden sind in die Javascript-Sprache integriert und helfen uns bei der Interaktion mit dem Benutzer.
Alert zeigt auf dem Browserbildschirm ein Fenster mit bestimmten Informationen an, das das Skript anhält, bis der Benutzer auf OK klickt.
Die Eingabeaufforderung zeigt normalerweise ein Fenster an, in dem dem Benutzer eine Frage gestellt wird, die er in einem bestimmten Textfeld beantworten muss, bevor er auf „OK“ klickt. Der Benutzer kann auch nichts eingeben, indem er die Abbrechen-Taste drückt.
Bestätigen zeigt außerdem ein Fenster an, in dem der Benutzer nichts mehr in das Textfeld eingeben kann, sondern nur noch auf OK oder Abbrechen klicken kann.
Lassen Sie uns nun nach einer kurzen Einführung dazu übergehen, alle oben genannten Punkte in der Praxis zu betrachten.



alarmieren, auffordern, bestätigen



alarm("Hallo, lieber Benutzer!" );
var nameUser = prompt("Ihr Name?", "Name");
var userAnswer = bestätigen("Sind Sie sicher, dass Sie die Site verlassen möchten?" );



Wenn wir die Browserseite aktualisieren, sehen wir daher ein Fenster, in dem der Benutzer begrüßt wird. Nachdem Sie auf OK geklickt haben, erscheint das folgende Fenster, in dem Sie nach Ihrem Namen gefragt werden. Diese Methode verfügt über zwei Parameter. Der erste ist erforderlich und für den angezeigten Titel verantwortlich. In unserem Fall handelt es sich um eine Frage nach dem Benutzernamen. Und der zweite Parameter ist für den Wert verantwortlich, der standardmäßig im Textfeld angezeigt wird. Wenn Sie Ihren Namen eingeben und auf OK klicken, wird Ihr Name in die Variable nameUser eingefügt. Wenn Sie auf die Schaltfläche „Abbrechen“ klicken, wird Null in die Variable geschrieben.
Und schließlich ein Fenster, das den Benutzer fragt, ob er unsere Seite verlassen möchte oder nicht. Im Falle einer Einwilligung wird der boolesche Wert true in die Variable eingefügt, im Falle einer Verweigerung entsprechend false. Das ist alles, was Sie über diese Methoden wissen müssen. Wir sehen uns in den nächsten Lektionen!

HTML, XHTML und CSS 100 % Kvint Igor Methode bestätigen()

bestätigen()-Methode

Die Methode „confirm()“ zeigt ein Bestätigungsfenster an, das dem von der Methode „alert()“ generierten Warnfenster ähnelt, jedoch zwei Schaltflächen enthält: OK und Abbrechen. Listing 11.3 zeigt das Erstellen eines Bestätigungsfensters, aber dieses Skript unterscheidet nicht zwischen den Schaltflächen „OK“ und „Abbrechen“. Durch Drücken einer der Tasten wird das Fenster einfach geschlossen (Abb. 11.5).

Reis. 11.5. Arbeiten mit Bestätigung

Listing 11.3. Arbeiten mit Bestätigung

Arbeiten mit Bestätigung

bestätigen("Das ist meine Bestätigung");

Nachdem Sie dieses Kapitel gelesen haben, erfahren Sie, wie Sie mit dieser Methode Ihr Skript anders reagieren lassen, wenn Sie auf die Schaltflächen „OK“ und „Abbrechen“ klicken.

Aus dem Buch Windows Script Host für Windows 2000/XP von Andrey Vladimirovich Popov

Run-Methode Der Parameter intWindowStyle legt den Fenstertyp für die zu startende Anwendung fest (Tabelle 1.13).Tabelle 1.13. Fenstertypen (intWindowStyle) Parameter Visual Basic-Konstante Beschreibung 0 vbHide Versteckt das aktuelle Fenster und aktiviert ein anderes Fenster (zeigt es an und gibt ihm den Fokus) 1 vbNormalFocus Aktiviert und

Aus dem Buch Programming in Ruby [Sprachideologie, Theorie und Praxis der Anwendung] von Fulton Hal

Löschmethode Wenn der Force-Parameter falsch ist oder nicht angegeben ist, ist es mit der Löschmethode nicht möglich, ein Verzeichnis mit einem schreibgeschützten Attribut zu löschen. Wenn Sie „force“ auf „true“ setzen, können solche Verzeichnisse sofort gelöscht werden. Bei Verwendung der Methode „Delete“ spielt es keine Rolle, ob das angegebene Verzeichnis vorhanden ist

Aus dem Buch Programming PDAs and Smartphones on the .NET Compact Framework von Klimov Alexander P.

Verschiebungsmethode Der erforderliche Zielparameter gibt das Verzeichnis an, in das verschoben werden soll. Platzhalter sind in einem Verzeichnisnamen nicht zulässig. Hinweis Anstelle der Move-Methode können Sie auch die MoveFolder-Objektmethode verwenden

Aus dem Buch Linux und UNIX: Shell-Programmierung. Entwicklerhandbuch. von Tainsley David

Kopiermethode Der erforderliche Zielparameter gibt die Datei an, in die kopiert werden soll. Platzhalter sind in einem Dateinamen nicht zulässig. Der Parameter „overwrite“ ist eine boolesche Variable, die bestimmt, ob eine vorhandene Datei mit dem Namen „destination“ überschrieben werden soll (overwrite=true).

Aus dem Buch Beschreibung der PascalABC.NET-Sprache vom RuBoard-Team

Löschmethode Wenn der Force-Parameter falsch ist oder nicht angegeben ist, ist es mit der Löschmethode nicht möglich, eine Datei mit einem schreibgeschützten Attribut zu löschen. Wenn Sie „force“ auf „true“ setzen, können solche Dateien sofort gelöscht werden. Hinweis: Sie können die Methode „DeleteFile“ anstelle der Methode „Delete“ verwenden.

Aus dem Buch des Autors

8.3.1. Die inject-Methode Die inject-Methode kam aus der Smalltalk-Sprache zu Ruby (sie erschien erstmals in Ruby 1.8). Sein Verhalten ist interessant, obwohl es beim ersten Mal nicht leicht zu verstehen ist. Es spiegelt die Tatsache wider, dass wir oft die Liste durchgehen und dabei einige Ergebnisse „akkumulieren“ möchten. Natürlich die meisten

Aus dem Buch des Autors

8.3.3. Partitionierungsmethode Wie sie sagen: „Es gibt zwei Arten von Menschen auf der Welt: diejenigen, die Menschen in verschiedene Typen einteilen, und diejenigen, die das nicht tun.“ Die Partitionsmethode bezieht sich nicht auf Personen (obwohl wir sie in Ruby als Objekte darstellen können), sondern teilt die Menge auch in zwei Teile. Wenn beim Aufruf von Partition ein Block angegeben wird, wird dieser ausgewertet

Aus dem Buch des Autors

11.1.10. initialize_copy-Methode Beim Kopieren eines Objekts mit der dup- oder clone-Methode wird der Konstruktor nicht aufgerufen. Alle Statusinformationen werden kopiert. Aber was ist, wenn Sie dieses Verhalten nicht benötigen? Schauen wir uns ein Beispiel an: class Document attr_accessor:title, :text attr_reader:timestamp def initialize(title, text) @title, @text = title, text @timestamp =

Aus dem Buch des Autors

11.1.11. Die Allocate-Methode ist selten, aber es kommt vor, dass Sie ein Objekt erstellen müssen, ohne seinen Konstruktor aufzurufen (unter Umgehung der Initialisierungsmethode). Beispielsweise kann es sein, dass der Zustand eines Objekts vollständig durch seine Zugriffsmethoden bestimmt wird; dann besteht keine Notwendigkeit, die neue Methode (die initialize aufruft) aufzurufen, es sei denn, Sie

Aus dem Buch des Autors

11.3.2. const_get-Methode Die const_get-Methode ruft den Wert einer Konstante mit dem angegebenen Namen aus dem Modul oder der Klasse ab, zu der sie gehört.str = "PI"Math.const_get(str) # Der Wert ist Math::PI. Dies ist eine Möglichkeit dazu Vermeiden Sie es, die Methode eval aufzurufen, da dies manchmal als unelegant angesehen wird. Dieser Ansatz ist aus der Sicht günstiger

Aus dem Buch des Autors

11.3.5. Die Methode „define_method“ Abgesehen vom Schlüsselwort „def“ besteht die einzige normale Möglichkeit, einer Klasse oder einem Objekt eine Methode hinzuzufügen, darin, die Methode „define_method“ zu verwenden. Sie ermöglicht dies zur Laufzeit. Natürlich geschieht in Ruby fast alles zur Laufzeit Laufzeit. Wenn

Aus dem Buch des Autors

11.3.6. const_missing-Methode Die const_missing-Methode ähnelt der method_missing-Methode. Beim Versuch, auf eine unbekannte Konstante zuzugreifen, wird diese Methode aufgerufen – sofern sie definiert ist. Als Parameter wird ihm ein Symbol übergeben, das auf eine Konstante verweist. Um Aufrufe abzufangen

Aus dem Buch des Autors

Lockbits-Methode Mit .NET Compact Framework 2.0 wurde eingeschränkte Unterstützung für die LockBits-Methode eingeführt, mit der ein Array von Bildpixeln bearbeitet werden kann. Die ImageLockMode-Enumeration in dieser Methode lässt die Werte ReadWrite, ReadOnly und WriteOnly zu. Und die PixelFormat-Enumeration unterstützt

Aus dem Buch des Autors. Aus dem Buch des Autors

Methode Zip Beschreibung der Methoden Methoden werden für die Sequenzsequenz von T angegeben. Funktion Zip(second: Sequenz von TSecond; resultSelector: (T,TSecond)->Res): Sequenz von Res; Verkettet zwei Sequenzen mit der angegebenen Funktion, die ein Element jeder Sequenz übernimmt und

Aus dem Buch des Autors

Methode Enthält Beschreibung der Methoden Methoden werden für die Sequenzsequenz von T angegeben. Funktion Enthält (Wert: T): boolean; Bestimmt mithilfe des Standardgleichheitskomparators, ob das angegebene Element in der Sequenz enthalten ist. Funktion Enthält(Wert: T; Vergleicher: IEqualityComparer): boolean;