Heim > Web-Frontend > js-Tutorial > Detaillierte Einführung in die Verwendung von showModalDialog in JS zum Schließen des Unterfensters und Aktualisieren des Hauptfensters

Detaillierte Einführung in die Verwendung von showModalDialog in JS zum Schließen des Unterfensters und Aktualisieren des Hauptfensters

黄舟
Freigeben: 2017-03-25 14:25:16
Original
1436 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich die Verwendung von showModalDialog in JS zum Schließen des Unterfensters und zum Aktualisieren des Hauptfensters vorgestellt. Er analysiert detailliert die allgemeine Verwendung und die damit verbundenen Verwendungsfähigkeiten von showModalDialog Wer es braucht, kann darauf verweisen

Das Beispiel in diesem Artikel beschreibt die Verwendung von showModalDialog in JS, um das untergeordnete Fenster zu schließen und das Hauptfenster zu aktualisieren. Ich teile es Ihnen als Referenz mit:

Nach langer Online-Suche waren die meisten davon window.opener.location.reload() usw.

Am Ende war es nicht das, was ich wollte. Wenn Sie etwas finden, das Sie wissen möchten, schauen Sie unten

showModalDialog und showModelessDialog

1. Was ist der Unterschied zwischen showModalDialog und showModelessDialog?

showModalDialog: Nach dem Öffnen bleibt der Eingabefokus immer erhalten. Der Benutzer kann nicht zum Hauptfenster wechseln, es sei denn, das Dialogfeld wird geschlossen. Ähnlich dem Operationseffekt von Alert.
showModelessDialog: Nach dem Öffnen kann der Benutzer den Eingabefokus zufällig wechseln. Es hat keine Auswirkung auf das Hauptfenster (höchstens ist es für eine Weile blockiert.

2. Wie kann verhindert werden, dass die Hyperlinks zwischen showModalDialog und showModelessDialog neue Fenster öffnen?

Fügen Sie einfach <base target="_self"> zur geöffneten Webseite hinzu. Dieser Satz wird normalerweise zwischen <head> platziert und showModelessDialog?

Sie können in showModalDialog und showModelessDialog nicht F5 drücken, und Sie können sich nur auf das Javascript verlassen.

Ersetzen Sie filename.htm durch den Namen der Webseite, die Sie öffnen. Drücken Sie F5 zum Aktualisieren. Hinweis: Dies muss in Verbindung mit , sonst erscheint ein neues Fenster, wenn Sie F5 drücken.

<body onkeydown="if (event.keyCode==116){reload.click()}">
<a id="reload" href="filename.htm" rel="external nofollow" style="display:none">reload...</a>
Nach dem Login kopieren
4. So deaktivieren Sie showModalDialog (oder showModelessDialog) mit Javascript. Das geöffnete Fenster.

muss auch mit <base target="_self"> übereinstimmen, sonst wird ein neues IE-Fenster geöffnet und dann geschlossen >

5. ShowModalDialog- und showModelessDialog-Datenübertragungsfähigkeiten
<input type="button" value="关闭" onclick="window.close()">
Nach dem Login kopieren

(Anmerkung des Autors: Ursprünglich wollte ich es im Frage-und-Antwort-Format schreiben, aber ich wollte es. Wie kann ich diese Frage stellen? Ich muss das tun)Diese Sache ist schwieriger. Ich habe sie mehrmals geändert und kann sie nicht erklären (meine Sprachkenntnisse werden immer schlechter), also muss ich sie anhand eines Beispiels erklären . Beispiel:

Jetzt müssen Sie eine

-Variable in einem showModalDialog (oder showModelessDialog) lesen oder festlegen.

var_name

Allgemeine Übermittlungsmethode:

Diese Methode ist zufriedenstellend, aber was ist, wenn Sie gleichzeitig die zweite Variable var_id verwenden möchten? Dies ist die Einschränkung dieser Übertragungsmethode.

Hier ist die Methode, die ich empfehle Übergabe:

window.showModalDialog("filename.htm",var_name)
//传递var_name变量
在showModalDialog(或showModelessDialog)读取和设置时:
alert(window.dialogArguments)//读取var_name变量
window.dialogArguments="oyiboy"//设置var_name变量
Nach dem Login kopieren
Beim Lesen und Festlegen durch showModalDialog (oder showModelessDialog):

Auch ich kann die Variable var_id bedienen

window.showModalDialog("filename.htm",window)
//不管要操作什么变量,只直传递主窗口的window对象
Nach dem Login kopieren

kann auch Bearbeiten Sie ein beliebiges Objekt im Hauptfenster, beispielsweise die Elemente im

Formularobjekt
alert(window.dialogArguments.var_name)//读取var_name变量
window.dialogArguments.var_name="oyiboy"//设置var_name变量
Nach dem Login kopieren
.

alert(window.dialogArguments.var_id)//读取var_id变量
window.dialogArguments.var_id="001"//设置var_id变量
Nach dem Login kopieren

6. Zusammenwirken mehrerer showModelessDialog.

window.dialogArguments.form1.index1.value="这是在设置index1元素的值"
Nach dem Login kopieren

Weil es sehr schwierig ist, einfach darüber zu reden, bin ich einfach faul und benutze einfach Code, um es zu erklären. Die Hauptfunktion des folgenden Codes besteht darin, die Position eines anderen showModelessDialog innerhalb eines showModelessDialog zu verschieben. Teil des js-Codes der Hauptdatei.

Steuern Sie einen Teil des .htm-Codes.

Die oben genannten Schlüsselelemente sind:

var s1=showModelessDialog(&#39;&#39;控制.htm&#39;&#39;,window,"dialogTop:1px;dialogLeft:1px") //打开控制窗口
var s2=showModelessDialog(&#39;&#39;about:blank&#39;&#39;,window,"dialogTop:200px;dialogLeft:300px")
//打开被控制窗口
Nach dem Login kopieren

Fensterbenennungsmethode:
<script>
//操作位置数据,因为窗口的位置数据是"xxxpx"方式的,所以需要这样的一个特殊操作函数。
function countNumber(A_strNumber,A_strWhatdo)
{
 A_strNumber=A_strNumber.replace(&#39;&#39;px&#39;&#39;,&#39;&#39;&#39;&#39;)
 A_strNumber-=0
 switch(A_strWhatdo)
 {
 case "-":A_strNumber-=10;break;
 case "+":A_strNumber+=10;break;
 }
 return A_strNumber + "px"
}
</script>
<input type="button" onclick="window.dialogArguments.s2.dialogTop=countNumber
(window.dialogArguments.s2.dialogTop,&#39;&#39;-&#39;&#39;)" value="上移">
<input type="button" onclick="window.dialogArguments.s2.dialogLeft=countNumber
(window.dialogArguments.s2.dialogLeft,&#39;&#39;-&#39;&#39;)" value="左移">
<input type="button" onclick="window.dialogArguments.s2.dialogLeft=countNumber
(window.dialogArguments.s2.dialogLeft,&#39;&#39;+&#39;&#39;)" value="右移">
<input type="button" onclick="window.dialogArguments.s2.dialogTop=countNumber
(window.dialogArguments.s2.dialogTop,&#39;&#39;+&#39;&#39;)" value="下移">
Nach dem Login kopieren

Variablenzugriffsmethode:

var s1=showModelessDialog(&#39;&#39;控制.htm&#39;&#39;,window,"dialogTop:1px;dialogLeft:1px")
Nach dem Login kopieren

Dieses Beispiel zeigt nur die Positionsoperationsfunktion zwischen showModelessDialog und showModelessDialog. Durch dieses Prinzip steuert showModelessDialog die jeweiligen Anzeigeseiten usw. Dies hängt von Ihrer Leistung ab. Wenn Sie ein modales Fenster öffnen und dieses Fenster schließen und das übergeordnete Fenster im geöffneten Fenster neu laden möchten, lautet der Code wie folgt:

window.dialogArguments.s2.dialogTop
Nach dem Login kopieren
Der Code lautet wie folgt:

oder

Das obige ist der detaillierte Inhalt vonDetaillierte Einführung in die Verwendung von showModalDialog in JS zum Schließen des Unterfensters und Aktualisieren des Hauptfensters. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
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