Heim > Web-Frontend > js-Tutorial > Einführung in die Verwendung von js-modalen Fenstern (modale Dialogfelder und nichtmodale Dialogfelder)_Grundkenntnisse

Einführung in die Verwendung von js-modalen Fenstern (modale Dialogfelder und nichtmodale Dialogfelder)_Grundkenntnisse

WBOY
Freigeben: 2016-05-16 16:41:40
Original
1315 Leute haben es durchsucht

Javascript ist in modale Dialogfelder und Nicht-Modus-Dialogfelder unterteilt. Der Unterschied zwischen beiden besteht tatsächlich darin, ob der Benutzer an anderer Stelle auf derselben Seite arbeiten kann, bevor das Dialogfeld geschlossen wird. Das Dialogfeld „Datei öffnen“ ist beispielsweise ein typisches modales Dialogfeld. Nur wenn Sie in diesem Dialogfeld Maßnahmen ergreifen, können Sie andere Vorgänge in dem Programm ausführen, das das Dialogfeld öffnet. Dies ist für nicht modale Dialogfelder nicht erforderlich .

Modaler Dialog: showModalDialog
Modusloser Dialog: showModelessDialog

vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])
vReturnValue = window.showModelessDialog(sURL [, vArguments] [,sFeatures])

Rückgabewert: vReturnValue, natürlich wird der Rückgabewert aus dem Dialogfeld
zurückgegeben sURL: erforderlich, die Seite, die Sie öffnen möchten;

vArguments--

Optionaler Parameter, Typ: Variante. Wird verwendet, um Parameter an das Dialogfeld zu übergeben. Die Art der übergebenen Parameter ist nicht beschränkt, einschließlich Arrays usw. Das Dialogfeld erhält die über window.dialogArguments übergebenen Parameter.

sFeatures--
Optionaler Parameter, Typ: Zeichenfolge. Zur Beschreibung des Erscheinungsbilds des Dialogfelds und anderer Informationen können Sie einen oder mehrere der folgenden, durch Semikolons „;“ getrennten Werte verwenden.
1.DialogHeight: Die Höhe des Dialogfelds, nicht weniger als 100 Pixel. Die Standardeinheit von DialogHeight und DialogWidth in IE4 ist em, während sie in IE5 px ist. Zur Vereinfachung der Anzeige verwenden Sie beim Definieren eines modalen Dialogfelds px als Einheit.
2.dialogWidth: Breite des Dialogfelds.
3.dialogLeft: Abstand von der linken Seite des Bildschirms.
4.dialogTop: Abstand vom Bildschirm.
5.center: {yes |. 1 |. 0}: Ob das Fenster zentriert ist, der Standardwert ist ja, aber die Höhe und Breite können weiterhin angegeben werden.
6.Hilfe: {Ja |. 1 |. 0}: Ob die Hilfeschaltfläche angezeigt werden soll, die Standardeinstellung ist Ja.
7.resizable: {yes |. no |. 0} [IE5+]: Ob die Größe geändert werden kann. Der Standardwert ist Nein.
8.status: {ja |. nein |. 0} [IE5]: Ob die Statusleiste angezeigt werden soll. Der Standardwert ist „yes[Modal]“ oder „no[Modal]“.
9.scroll:{ ja |. 1 |. 0 | aus }: Gibt an, ob das Dialogfeld Bildlaufleisten anzeigt. Der Standardwert ist „Ja“.
Die folgenden Attribute werden in HTA verwendet und werden im Allgemeinen nicht auf normalen Webseiten verwendet.
10.dialogHide:{ ja |. 1 | aus }: Ob das Dialogfeld beim Drucken oder in der Druckvorschau ausgeblendet ist. Der Standardwert ist Nein.
11.edge:{ versunken |. angehoben }: Gibt den Rahmenstil des Dialogfelds an. Der Standardwert wird erhöht.
12.unadored:{ ja |. 1 |.

Parameterübergabe:

1. Um Parameter an das Dialogfeld zu übergeben, werden sie über vArguments übergeben. Für den Typ gibt es keine Begrenzung. Bei Zeichenfolgetypen beträgt die maximale Länge 4096 Zeichen. Es können auch Objekte übergeben werden, zum Beispiel:

----------------
parent.htm

<script> 
var obj = new Object(); 
obj.name="51js"; 
window.showModalDialog("modal.htm",obj,"dialogWidth=200px;dialogHeight=100px"); 
</script>
Nach dem Login kopieren
modal.htm

<script> 
var obj = window.dialogArguments 
alert("您传递的参数为:" + obj.name) 
</script>
Nach dem Login kopieren
-----------------

2. Sie können über window.returnValue Informationen an das Fenster zurückgeben, das das Dialogfeld geöffnet hat, und natürlich kann es sich auch um ein Objekt handeln. Zum Beispiel:
----------------
parent.htm

<script> 
str =window.showModalDialog("modal.htm",,"dialogWidth=200px;dialogHeight=100px"); 
alert(str); 
</script>
Nach dem Login kopieren
modal.htm

<script> 
window.returnValue="http://www.51js.com"; 
</script>
Nach dem Login kopieren
Nach der Verwendung von window.showModalDialog oder window.showModelessDialog zum Öffnen eines modalen Fensters treten einige Interaktionsprobleme mit dem übergeordneten Fenster auf.

Voraussetzung für interaktive Operationen ist, dass beim Aufruf der Methode showModalDialog oder showModelessDialog der zweite Parameter an window übergeben wird, z. B.:
window.showModelessDialog('filename.htm',window,'dialogWidth=200px;dialogHeight=250px;')
Als nächstes müssen einige Daten und Methoden des übergeordneten Fensters abgerufen werden. Das übergeordnete Fenster kann normalerweise die Parameter des untergeordneten Fensters über returnValue
abrufen

//取得父窗口的JS变量 var 
window.dialogArguments.var; 
//获得父窗口的对象和属性 
window.dialogArguments.form1.name.value ; 
//调用父窗口的方法 fun
window.dialogArguments.fun() ;
Nach dem Login kopieren
Verwandte Etiketten:
js
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage