Zusammenfassung der JavaScript-Popup-Fenstermethoden_Javascript-Kenntnisse

Die Beispiele in diesem Artikel fassen die häufig verwendeten JavaScript-Popup-Fenstermethoden zu Ihrem Vergleich und als Referenz zusammen. Die detaillierte Methode lautet wie folgt:

1. Aktualisieren Sie die Webseite ohne Aufforderung:

Ist Ihnen aufgefallen, dass beim Aktualisieren einiger Webseiten ein Eingabeaufforderungsfenster angezeigt wird? Klicken Sie zum Aktualisieren auf „OK“.
Auf einigen Seiten wird keine Eingabeaufforderung angezeigt und sie werden direkt aktualisiert, ohne dass ein Eingabeaufforderungsfenster angezeigt wird.
Wenn die Seite kein Formular hat,
Das Eingabeaufforderungsfenster wird nicht angezeigt
Wenn die Seite ein Formular hat,
a)

Es öffnet sich ein Eingabeaufforderungsfenster
b) Wird nicht angezeigt

2. So aktualisieren Sie die Seite mit Javascript:

window.location.reload();

Verwenden Sie das von window.open() geöffnete Popup-Fenster, um das übergeordnete Fenster zu aktualisieren

window.opener.location.reload()

Verwenden Sie window.showDialog, um ein modales Fenster zu öffnen

window.dialogArguments.location.reload();

3.Javascript-Popup-Fenstercode:

window.open()-Methode:
window.open() unterstützte Umgebung: JavaScript1.0 /JScript1.0 /Nav2 /IE3 /Opera3 Grundlegende Syntax:

window.open(pageURL,name,parameters) 

Unter ihnen:

pageURL ist der Unterfensterpfad

Name ist das untergeordnete Fensterhandle
Parameter sind Fensterparameter (jeder Parameter wird durch Kommas getrennt)

Beispiel:

<SCRIPT> 
<!-- 
window.open ('page.html','newwindow','height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no') 
//写成一行 
--> 
</SCRIPT>

Nachdem das Skript ausgeführt wurde, wird page.html in einem neuen Fenster mit einer Breite von 100, einer Höhe von 400, 0 Pixel vom oberen Bildschirmrand, 0 Pixel vom linken Bildschirmrand und ohne Symbolleiste geöffnet , keine Menüleiste und keine Scrollleiste, keine Größenänderung, keine Adressleiste, keine Statusleiste.

Bitte vergleichen.

Das obige Beispiel umfasst mehrere häufig verwendete Parameter. Darüber hinaus gibt es viele andere Parameter, siehe 4.

Verschiedene Parameter

Unter diesen kann Ja/Nein auch 1/0 verwenden; der Pixelwert ist ein spezifischer Wert, Einheitspixel.

Parameter |. Wertebereich | |. |.

AlwaysLowered |. Ja/Nein |. Das angegebene Fenster wird hinter allen Fenstern ausgeblendet

AlwaysRaised |. Ja/Nein |. Das angegebene Fenster wird über allen Fenstern angezeigt
abhängig |. ja/nein |. Ob gleichzeitig mit dem übergeordneten Fenster geschlossen werden soll
Verzeichnisse |. ja/nein |. Ob die Verzeichnisleiste von Nav2 und 3 sichtbar ist
Höhe |. Pixelwert |. Fensterhöhe
Hotkeys |. ja/nein |. Legen Sie einen sicheren Exit-Hotkey in einem Fenster ohne Menüleiste fest
innerHeight |. Pixelhöhe des Dokuments im Fenster
innerWidth |. Pixelbreite des Dokuments im Fenster
Standort |. ja/nein |. ob die Standortleiste sichtbar ist
Menüleiste |. ja/nein |. Ob die Menüleiste sichtbar ist
äußereHöhe |. Pixelwert |. Legt die Pixelhöhe des Fensters fest (einschließlich dekorativer Ränder)
äußereWidth |. Pixelwert |. Legt die Pixelbreite des Fensters fest (einschließlich dekorativer Ränder)
veränderbar |. ja/nein |. Ob die Größe des Fensters veränderbar ist
screenX |. Pixelwert |. Die Länge des Fensters in Pixel vom linken Bildschirmrand
screenY |. Pixelwert |. Die Länge des Fensters in Pixel vom oberen Rand des Bildschirms
Bildlaufleisten |. ja/nein |. Ob das Fenster Bildlaufleisten haben kann
titlebar |. ja/nein |. Ob die Fenstertitelleiste sichtbar ist
Symbolleiste |. ja/nein |. Ob die Fenstersymbolleiste sichtbar ist
Breite |. Pixelwert |. Pixelbreite des Fensters
z-look |. ja/nein |. Ob das Fenster nach der Aktivierung über anderen Fenstern schwebt

function ShowDialog(url) {
  var iWidth=300; //窗口宽度
  var iHeight=200;//窗口高度
  var iTop=(window.screen.height-iHeight)/2;
  var iLeft=(window.screen.width-iWidth)/2;
  window.open(url,"Detail","Scrollbars=no,Toolbar=no,Location=no,Direction=no,Resizeable=no,
Width="+iWidth+" ,Height="+iHeight+",top="+iTop+",left="+iLeft);
 }

window.showModalDialog-Methode:

Grundlegende Einführung:

showModalDialog() (IE 4 unterstützt)

showModelessDialog() (IE 5 unterstützt)

Die Methode window.showModalDialog() wird verwendet, um ein modales Dialogfeld zu erstellen, das HTML-Inhalte anzeigt.

Die Methode window.showModelessDialog() wird verwendet, um ein nichtmodales Dialogfeld zu erstellen, das HTML-Inhalte anzeigt.

Anwendung:

参数说明：

sURL--
必选参数，类型：字符串。用来指定对话框要显示的文档的URL。
vArguments--
可选参数，类型：变体。用来向对话框传递参数。传递的参数类型不限，包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。
sFeatures--
可选参数，类型：字符串。用来描述对话框的外观等信息，可以使用以下的一个或几个，用分号“;”隔开。
1.dialogHeight :对话框高度，不小于１００px，ＩＥ４中dialogHeight 和 dialogWidth 默认的单位是em，而ＩＥ５中是px，为方便其见，在定义modal方式的对话框时，用px做单位。
2.dialogWidth: 对话框宽度。
3.dialogLeft: 离屏幕左的距离。
4.dialogTop: 离屏幕上的距离。
5.center: {yes | no | 1 | 0 }：窗口是否居中，默认yes，但仍可以指定高度和宽度。
6.help: {yes | no | 1 | 0 }：是否显示帮助按钮，默认yes。
7.resizable: {yes | no | 1 | 0 } ［ＩＥ５＋］：是否可被改变大小。默认no。
8.status: {yes | no | 1 | 0 } ［IE5+］：是否显示状态栏。默认为yes[ Modeless]或no[Modal]。
9.scroll:{ yes | no | 1 | 0 | on | off }：指明对话框是否显示滚动条。默认为yes。

下面几个属性是用在HTA中的，在一般的网页中一般不使用。

10.dialogHide:{ yes | no | 1 | 0 | on | off }：在打印或者打印预览时对话框是否隐藏。默认为no。
11.edge:{ sunken | raised }：指明对话框的边框样式。默认为raised。
12.unadorned:{ yes | no | 1 | 0 | on | off }：默认为no。

参数传递：

（1）.要想对话框传递参数，是通过vArguments来进行传递的。类型不限制，对于字符串类型，最大为4096个字符。也可以传递对象，例如：
-------------------------------
parent.htm页面：

<script>
var obj = new Object();
obj.name="jb51";
window.showModalDialog("modal.htm",obj,"dialogWidth=200px;dialogHeight=100px");
</script>

modal.htm页面：

<script>
var obj = window.dialogArguments
alert("您传递的参数为：" + obj.name)
</script>

(2)可以通过window.returnValue向打开对话框的窗口返回信息，当然也可以是对象。例如：

parent.htm页面代码：

<script>
str =window.showModalDialog("modal.htm",,"dialogWidth=200px;dialogHeight=100px");
alert(str);
</script>
modal.htm
<script>
window.returnValue="http://www.jb51.com";
</script>

例子：

function ShowDialog(url) {
  var iWidth=300; //窗口宽度
  var iHeight=200;//窗口高度
  var iTop=(window.screen.height-iHeight)/2;
  var iLeft=(window.screen.width-iWidth)/2;
  window.showModalDialog(url,window,"dialogHeight: "+iHeight+"px; dialogWidth: "+iWidth+"px;
dialogTop: "+iTop+"; dialogLeft: "+iLeft+"; resizable: no; status: no;scroll:no");
 }

注意这里的第二个参数，window

4.模式窗口数据不刷新（缓存）问题

在jsp页面加入如下语句

<%
   response.setHeader("Pragma","No-Cache");
   response.setHeader("Cache-Control","No-Cache");
   response.setDateHeader("Expires", 0);
%>

5.模式窗口中，链接弹出新窗口问题：

◎_blank，在新浏览器窗口中打开链接文件。

◎_parent，将链接的文件载入含有该链接框架的父框架集或父窗口中。如果含有该链接的框架不是嵌套的，则在浏览器全屏窗口中载入链接的文件，就象_self参数一样。

◎_self，在同一框架或窗口中打开所链接的文档。此参数为默认值，通常不用指定。

◎_top，在当前的整个浏览器窗口中打开所链接的文档，因而会删除所有框架。

在和间加入

6.无提示关闭页面的方法：

function CloseWin(){
  var ua = navigator.userAgent; var ie = navigator.appName=="Microsoft Internet Explorer"?true:false;
  if(ie){
 var IEversion = parseFloat(ua.substring(ua.indexOf("MSIE ")+5,ua.indexOf(";",ua.indexOf("MSIE "))));
  if( IEversion< 5.5){
  var str = '';
  document.body.insertAdjacentHTML("beforeEnd", str);
   document.all.noTipClose.Click();
  } else {
   window.opener =null; window.close();
  }
 }else{
 window.close()
 }
}

感兴趣的读者可以调试一下上述方法，相信会给大家带来一定的启发与帮助。