Maison > interface Web > js tutoriel > Introduction détaillée à l'utilisation de showModalDialog dans JS pour fermer la sous-fenêtre et actualiser la fenêtre principale.

Introduction détaillée à l'utilisation de showModalDialog dans JS pour fermer la sous-fenêtre et actualiser la fenêtre principale.

黄舟
Libérer: 2017-03-25 14:25:16
original
1395 Les gens l'ont consulté

Cet article présente principalement l'utilisation de showModalDialog dans JS pour fermer la sous-fenêtre et actualiser la fenêtre principale. Il analyse en détail l'utilisation courante et les compétences d'utilisation associées de showModalDialog sur la base d'exemples spécifiques. qui en a besoin peut s'y référer

L'exemple de cet article décrit l'utilisation de showModalDialog dans JS pour fermer la fenêtre enfant et actualiser la fenêtre principale. Je le partage avec vous pour votre référence. Les détails sont les suivants :

Après une longue recherche en ligne, la plupart d'entre eux étaient window.opener.location.reload(), etc.

Ce n'était pas ce que je voulais au final. Si vous trouvez quelque chose que vous voulez savoir, jetez un œil ci-dessous

showModalDialog et showModelessDialog

1. Quelle est la différence entre showModalDialog et showModelessDialog ?

showModalDialog : Après avoir été ouvert, le focus de saisie sera toujours maintenu. L'utilisateur ne peut pas basculer vers la fenêtre principale tant que la boîte de dialogue n'est pas fermée. Semblable à l’effet opérationnel de l’alerte.

showModelessDialog : après avoir été ouvert, l'utilisateur peut changer aléatoirement le focus d'entrée. Cela n'a aucun effet sur la fenêtre principale (tout au plus elle est bloquée pendant un moment.

2. Comment empêcher les hyperliens entre showModalDialog et showModelessDialog d'afficher de nouvelles fenêtres ?

Ajoutez simplement

à la page Web ouverte. Cette phrase est généralement placée entre <head> Comment actualiser le contenu dans showModalDialog. et showModelessDialog ?

Vous ne pouvez pas appuyer sur F5 pour actualiser dans showModalDialog et showModelessDialog, et vous ne pouvez compter que sur le menu javascript, voici le code pertinent :

Remplacez filename.htm par le nom de la page Web et placez-le dans la page Web que vous ouvrez. Appuyez sur F5 pour actualiser. Remarque : ceci doit être utilisé en conjonction avec , sinon une nouvelle fenêtre apparaîtra lorsque vous appuyez sur F5.

<body onkeydown="if (event.keyCode==116){reload.click()}">
<a id="reload" href="filename.htm" rel="external nofollow" style="display:none">reload...</a>
Copier après la connexion

4. Comment désactiver showModalDialog (ou showModelessDialog) en utilisant javascript. La fenêtre ouverte.

doit également correspondre à , sinon une nouvelle fenêtre IE sera ouverte puis fermée >

<input type="button" value="关闭" onclick="window.close()">
Copier après la connexion
5. Compétences en transfert de données ShowModalDialog et showModelessDialog

(Note de l'auteur : je voulais à l'origine l'écrire sous forme de questions-réponses, mais je le voulais. Comment puis-je poser cette question, alors Je dois faire ça)Cette chose est plus gênante. Je l'ai changé plusieurs fois et je ne peux pas l'expliquer (mes compétences linguistiques se détériorent), je dois donc utiliser un exemple pour l'expliquer. .

Exemple :

Vous devez maintenant lire ou définir une variable

dans un showModalDialog (ou showModelessDialog)

var_name

Méthode de livraison générale :

Cette méthode est satisfaisante, mais que faire si vous souhaitez faire fonctionner la deuxième variable var_id en même temps ? C'est la limitation de cette méthode de transfert . en le passant :

Lorsqu'il est lu et défini par showModalDialog (ou showModelessDialog) :
window.showModalDialog("filename.htm",var_name)
//传递var_name变量
在showModalDialog(或showModelessDialog)读取和设置时:
alert(window.dialogArguments)//读取var_name变量
window.dialogArguments="oyiboy"//设置var_name变量
Copier après la connexion

Je peux également utiliser la variable var_id

window.showModalDialog("filename.htm",window)
//不管要操作什么变量,只直传递主窗口的window对象
Copier après la connexion
peut également opérer sur n'importe quel objet dans la fenêtre principale, comme les éléments de l'

objet formulaire

.
alert(window.dialogArguments.var_name)//读取var_name变量
window.dialogArguments.var_name="oyiboy"//设置var_name变量
Copier après la connexion

alert(window.dialogArguments.var_id)//读取var_id变量
window.dialogArguments.var_id="001"//设置var_id变量
Copier après la connexion

6. Interaction de plusieurs showModelessDialog.

window.dialogArguments.form1.index1.value="这是在设置index1元素的值"
Copier après la connexion
Parce qu'il est très difficile d'en parler, je suis juste paresseux et j'utilise simplement du code pour l'expliquer.

La fonction principale du code suivant est de déplacer la position d'un autre showModelessDialog dans un showModelessDialog. Partie du code js du fichier principal.

Contrôlez une partie du code .htm.

Les éléments clés ci-dessus sont :

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")
//打开被控制窗口
Copier après la connexion

Méthode de dénomination des fenêtres :

<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="下移">
Copier après la connexion

Méthode d'accès aux variables :

var s1=showModelessDialog(&#39;&#39;控制.htm&#39;&#39;,window,"dialogTop:1px;dialogLeft:1px")
Copier après la connexion

Cet exemple montre uniquement la fonction d'opération de position entre showModelessDialog et showModelessDialog Grâce à ce principe, showModelessDialog contrôle les pages d'affichage respectives de chacun. etc. Cela dépend de vos performances. Si vous ouvrez une fenêtre modale et que vous souhaitez fermer cette fenêtre et recharger la fenêtre parent dans la fenêtre ouverte, le code est le suivant :

Le code est le suivant :
window.dialogArguments.s2.dialogTop
Copier après la connexion

ou


Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal