Operating the parent window object in ModalDialog1. You cannot use window.parent 2. The correct approach
a.html b.html code is as follows:
b.html</title> ; <BR><script language=javascript> <br>function func1(){ <br>//Get the parameters passed by the parent window<br>var ptextid = window.dialogArguments; <br>if(ptextid != undefined ){ <br>//Change the value of the object passed from the parent window to the "child window value" <br>ptextid.value = "child window value"; <br>//Close the child window<br>window.close (); <br>} <br>} <br></script> <br></head> <br><body> <br><input type=button value=” OK ” onclick= func1()> <br></body> <br></html> <br>
</div> <br>If there are many parent window objects that need to be operated, you can also use window or window.document as a parameter passed to the child window. <br>Example: <br>Requirement<br>Add a form with the id "aform" in a.html. There is a text box with the id test2 in the form. In b.html, in addition to the above operations, Also change the value of test2 to "subwindow value 2" and submit the form to c.html. <br>Implementation 1 <br>Change the function that opens the dialog box in a.html to the following method: <br>window.showModalDialog(“b.html”, window.document); <br>Change func1 in b.html () is changed to the following: <br><div class="codetitle">
<span><a style="CURSOR: pointer" data="71632" class="copybut" id="copybut71632" onclick="doCopy('code71632')"><u> Copy the code </u></a></span> The code is as follows: </div>
<div class="codebody" id="code71632"> <br>function func1(){ <br>var pdoc = window.dialogArguments; <br>if(pdoc!=undefined){ <br>pdoc.all.test1.value="child window value"; <br>pdoc.all.test2.value="child Window value 2″; <br>pdoc.all.aform.action=”c.html”; <br>pdoc.all.aform.submit(); <br>} <br>} <br>
</div> <br>Implementation 2 <br>Because there are many operations on the parent window in the child window, it can also be implemented using execScript. <br>Change the function that opens the dialog box in a.html to the following: <br><div class="codetitle">
<span><a style="CURSOR: pointer" data="11153" class="copybut" id="copybut11153" onclick="doCopy('code11153')"><u>Copy the code</u></a></span> The code is as follows:</div> <div class="codebody" id="code11153"> <br>window.showModalDialog(“b.html”, window); <br>
</div> <br>Add the javascript function as follows<br><div class="codetitle">
<span><a style="CURSOR: pointer" data="92591" class="copybut" id="copybut92591" onclick="doCopy('code92591')"><u>Copy code</u></a></span> The code is as follows: </div>
<div class="codebody" id="code92591"> <br>function func(){ <br>test1.value="child window value"; <br>document.all.test2.value=" Child window value 2″; <br>aform.action="c.html”; <br>aform.submit(); <br>} <br>
</div> <br>Change func1() in b.html As follows: <br><div class="codetitle">
<span><a style="CURSOR: pointer" data="74837" class="copybut" id="copybut74837" onclick="doCopy('code74837')"><u> Copy the code </u></a></span> The code is as follows: </div>
<div class="codebody" id="code74837"> <br>function func1(){ <br>var pwin = window.dialogArguments; <br>if(pwin!=undefined){ <br>var codeStr = ”func();” <br>pwin.execScript(codeStr,”javascript”); <br>window.close( ); <br>} <br>} <br>
</div>
<br>Usage experience of showModalDialog and showModelessDialog - Reposted <br><br><strong>1. What is the difference between showModalDialog and showModelessDialog? </strong> <br>showModalDialog: After being opened, the input focus will always be maintained. The user cannot switch to the main window unless the dialog box is closed. Similar to the operation effect of alert. <br>showModelessDialog: After being opened, the user can switch the input focus randomly. It has no effect on the main window (at most it is blocked for a while.) <br><br><strong> 2. How to prevent the hyperlinks in showModalDialog and showModelessDialog from popping up new windows? </strong> <br>Just add <base target="_self"> to the opened web page. This sentence is usually placed between <html> and <body>. <br><br><strong>3. How to refresh the content in showModalDialog and showModelessDialog? </strong> <br>You cannot press F5 to refresh in showModalDialog and showModelessDialog, and the menu cannot pop up. This can only rely on javascript. The following is the relevant code: <br><body onkeydown=”if (event.keyCode==116){reload.click()}”> <br><a id=”reload ” href=”filename.htm” style=”display:none”>reload…</a> <br>Replace filename.htm with the name of the web page and put it into the web page you open, press F5 It can be refreshed. Note that this must be used in conjunction with <base target="_self">, otherwise a new window will pop up when you press F5. <br><br><strong>4. How to use javascript to close the window opened by showModalDialog (or showModelessDialog) </strong> <br><input type="button" value="Close" onclick="window.close( )"> <br>Also match <base target="_self">, otherwise a new IE window will be opened and then closed. <br><br><strong>5. ShowModalDialog and showModelessDialog data transfer skills </strong> <br>(Author’s note: I originally wanted to write it in a question and answer format, but I couldn’t figure out how to ask this, so I had to That's it. ) <br>This thing is quite troublesome. I have changed it several times and I can't explain it (my language skills are getting worse), so I have to use an example to explain. <br><br><strong>Example</strong>: <br>Now you need to read or set a variable var_name in a showModalDialog (or showModelessDialog) <br>General delivery method: <br><div class="codetitle">
<span><a style="CURSOR: pointer" data="1540" class="copybut" id="copybut1540" onclick="doCopy('code1540')"><u>Copy code</u></a></span> The code is as follows:</div>
<div class="codebody" id="code1540"> <br>window.showModalDialog(“filename.htm”,var_name) <br>//Pass the var_name variable <br>When reading and setting in showModalDialog (or showModelessDialog): <br>alert(window.dialogArguments)//Read the var_name variable <br>window.dialogArguments=”oyiboy”//Set the var_name variable <br>This The method is satisfactory, but what if you want to operate the second variable var_id while operating var_name? It can no longer be operated. This is the limitation of this delivery method. <br>The following is the delivery method I recommend: <br>window.showModalDialog("filename.htm",window) <br>//No matter what variables you want to operate, only pass the window object of the main window directly <br> When showModalDialog (or showModelessDialog) reads and sets: <br>alert(window.dialogArguments.var_name)//Read the var_name variable <br>window.dialogArguments.var_name=”oyiboy”//Set the var_name variable <br>At the same time I You can also operate the var_id variable <br>alert(window.dialogArguments.var_id)//Read the var_id variable <br>window.dialogArguments.var_id=”001″//Set the var_id variable <br> You can also set any of the main window Objects are operated on, such as elements in the form object. <br>window.dialogArguments.form1.index1.value="This is setting the value of the index1 element" <br>
</div> <br><strong>6. Interaction of multiple showModelessDialogs </strong> <br>Because It's very laborious to just say it, so I'll be lazy and explain it directly in code. If you don't understand, just write to (oyiboy#163.net (please change # to @ when using)) and ask me. <br>The main function of the following code is to move the position of another showModelessDialog within a showModelessDialog. <br>Part of the js code of the main file. <br><div class="codetitle">
<span><a style="CURSOR: pointer" data="21430" class="copybut" id="copybut21430" onclick="doCopy('code21430')"><u>Copy code </u></a></span> The code is as follows: </div>
<div class="codebody" id="code21430"> <br>var s1=showModelessDialog('control.htm',window ,"dialogTop:1px;dialogLeft:1px") //Open the control window<br>var s2=showModelessDialog('about:blank',window,"dialogTop:200px;dialogLeft:300px") //Open the controlled window<br>
</div> <br>Control part of the .htm code. <br><div class="codetitle">
<span><a style="CURSOR: pointer" data="88318" class="copybut" id="copybut88318" onclick="doCopy('code88318')"><u>Copy code</u></a></span> The code is as follows:</div>
<div class="codebody" id="code88318"> <br><script> <br>//Operation position data, because the position data of the window is in "xxxpx" mode, so such a special operation function is needed. <br>function countNumber(A_strNumber,A_strWhatdo) <br>{ <br>A_strNumber=A_strNumber.replace('px',”) <br>A_strNumber-=0 <br>switch(A_strWhatdo) <br>{ <br> case ”-”:A_strNumber-=10;break; 🎜><input type=”button” onclick=”window.dialogArguments.s2.dialogTop=countNumber(window.dialogArguments.s2.dialogTop,'-')” value=”Move up”> <br><input type=”button” onclick=”window.dialogArguments.s2.dialogLeft=countNumber(window.dialogArguments.s2.dialogLeft,'-')” value=”Move left”> <br><input type=”button” onclick=”window.dialogArguments.s2.dialogLeft=countNumber(window.dialogArguments.s2.dialogLeft,' ')” value=”Move right”> <br><input type=”button” onclick=”window.dialogArguments .s2.dialogTop=countNumber(window.dialogArguments.s2.dialogTop,' ')" value="Move down"> <br><br> <br><br>The key part above is <br>: <br>Window naming method: var s1=showModelessDialog('control.htm',window,"dialogTop:1px;dialogLeft:1px") <br>Variable access method: window.dialogArguments.s2.dialogTop </div>This example is just reality showModelessDialog Through the position operation function between showModelessDialog and showModelessDialog, through this principle, showModelessDialog controls each other's respective display pages, transfers variables and data, etc. It all depends on your performance <br></div><div class="nphpQianMsg"><div class="clear"></div></div><div class="nphpQianSheng"><span>Statement：</span><div>The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn</div></div></div><div class="nphpSytBox"><span>Previous article：<a class="dBlack" title="jQuery (non-HTML5) editable table implementation code_jquery" href="https://m.php.cn/faq/18354.html">jQuery (non-HTML5) editable table implementation code_jquery</a></span><span>Next article：<a class="dBlack" title="jQuery (non-HTML5) editable table implementation code_jquery" href="https://m.php.cn/faq/18356.html">jQuery (non-HTML5) editable table implementation code_jquery</a></span></div><div class="nphpSytBox2"><div class="nphpZbktTitle"><h2>Related articles</h2><em><a href="https://m.php.cn/article.html" class="bBlack"><i>See more</i><b></b></a></em><div class="clear"></div></div><ins class="adsbygoogle"
style="display:block"
data-ad-format="fluid"
data-ad-layout-key="-6t+ed+2i-1n-4w"
data-ad-client="ca-pub-5902227090019525"
data-ad-slot="8966999616"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({});
</script><ul class="nphpXgwzList"><li><b></b><a href="https://m.php.cn/faq/1609.html" title="An in-depth analysis of the Bootstrap list group component" class="aBlack">An in-depth analysis of the Bootstrap list group component</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/faq/1640.html" title="Detailed explanation of JavaScript function currying" class="aBlack">Detailed explanation of JavaScript function currying</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/faq/1949.html" title="Complete example of JS password generation and strength detection (with demo source code download)" class="aBlack">Complete example of JS password generation and strength detection (with demo source code download)</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/faq/2248.html" title="Angularjs integrates WeChat UI (weui)" class="aBlack">Angularjs integrates WeChat UI (weui)</a><div class="clear"></div></li><li><b></b><a href="https://m.php.cn/faq/2351.html" title="How to quickly switch between Traditional Chinese and Simplified Chinese with JavaScript and the trick for websites to support switching between Simplified and Traditional Chinese_javascript skills" class="aBlack">How to quickly switch between Traditional Chinese and Simplified Chinese with JavaScript and the trick for websites to support switching between Simplified and Traditional Chinese_javascript skills</a><div class="clear"></div></li></ul></div></div><ins class="adsbygoogle"
style="display:block"
data-ad-format="autorelaxed"
data-ad-client="ca-pub-5902227090019525"
data-ad-slot="5027754603"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({});
</script><footer><div class="footer"><div class="footertop"><img src="/static/imghwm/logo.png" alt=""><p>Public welfare online PHP training，Help PHP learners grow quickly！</p></div><div class="footermid"><a href="https://m.php.cn/about/us.html">About us</a><a href="https://m.php.cn/about/disclaimer.html">Disclaimer</a><a href="https://m.php.cn/update/article_0_1.html">Sitemap</a></div><div class="footerbottom"><p> © php.cn All rights reserved
</p></div></div></footer><script>isLogin = 0;</script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script></div><script src="https://vdse.bdstatic.com//search-video.v1.min.js"></script><link rel='stylesheet' id='_main-css' href='/static/css/viewer.min.css' type='text/css' media='all'/><script type='text/javascript' src='/static/js/viewer.min.js?1'></script><script type='text/javascript' src='/static/js/jquery-viewer.min.js'></script><script>jQuery.fn.wait = function (func, times, interval) {
var _times = times || -1, //100次
_interval = interval || 20, //20毫秒每次
_self = this,
_selector = this.selector, //选择器
_iIntervalID; //定时器id
if( this.length ){ //如果已经获取到了，就直接执行函数
func && func.call(this);
} else {
_iIntervalID = setInterval(function() {
if(!_times) { //是0就退出
clearInterval(_iIntervalID);
}
_times <= 0 || _times--; //如果是正数就 --
_self = $(_selector); //再次选择
if( _self.length ) { //判断是否取到
func && func.call(_self);
clearInterval(_iIntervalID);
}
}, _interval);
}
return this;
}
$("table.syntaxhighlighter").wait(function() {
$('table.syntaxhighlighter').append("<p class='cnblogs_code_footer'><span class='cnblogs_code_footer_icon'></span></p>");
});
$(document).on("click", ".cnblogs_code_footer",function(){
$(this).parents('table.syntaxhighlighter').css('display','inline-table');$(this).hide();
});
$('.nphpQianCont').viewer({navbar:true,title:false,toolbar:false,movable:false,viewed:function(){$('img').click(function(){$('.viewer-close').trigger('click');});}});
</script></body><!-- Matomo --><script> var _paq = window._paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="https://tongji.php.cn/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '9']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script><!-- End Matomo Code --></html> 
