jQuery使用模式窗口实现在主页面和子页面中互相传值的方法

2019-11-20 10:28:45

字体：大中小

来源：转载

供稿：网友

本文实例讲述了jQuery使用模式窗口实现在主页面和子页面中互相传值的方法。分享给大家供大家参考，具体如下：

主面面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title></title><script src="jquery-1.7.2.min.js" type="text/javascript"></script><script type="text/javascript">function openWindow() {  var oldValue = { Name:$("#Name").val(),Age:$("#Age").val() };  var result = popModal("window.html", 300, 200, oldValue);  if (result!=null && typeof (result) != "undefined") {    $("#Name").val(result.Name);    $("#Age").val(result.Age);  }}//=====================================================================//作  者：yenange , 20120525//功能说明: 弹出一个模式窗口 （测试：IE6/7/8 和 Firefox 正常， Chrome可以弹出， 但长宽有变而且不是模式， 它本身不支持）//输入参数: 路径,宽度,高度,参数(可选)function popModal(url, width, height, parameter ) {  var feature = 'dialogWidth=' + width+'px'+ ';dialogHeight=' + height + 'px'+ ';dialogTop=' + (screen.height - height) / 2 + 'px'+ ';dialogLeft=' + (screen.width - width) / 2 + 'px'+ ';help:no;resizable:no;status=no;scroll:no';  if(typeof(parameter)=="undefined")    return window.showModalDialog(url, feature);  else    return window.showModalDialog(url, parameter, feature);}//=====================================================================//功能说明: 弹出一个窗口//输入参数: 路径,窗口名称,宽度,高度function pop(helpurl, windowName, width, height) {  var feature ='width=' + width    + ',height=' + height    + ',top=' + (screen.height - height) / 2    + ',left=' + (screen.width - width) / 2    +',toolbar=no,menubar=no,scrollbars=yes,resizable=no,location=no,status=no';  window.open(helpurl, windowName, feature);}</script></head><body>  <div>    名字<input id="Name" type="text" /><br />    年龄<input id="Age" type="text" /><br />    <input id="Button1" type="button" value="打开模式窗口" onclick="openWindow()" />  </div></body></html>

子页面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title></title><script src="jquery-1.7.2.min.js" type="text/javascript"></script><script type="text/javascript">$(function () {  var param = window.dialogArguments;  $("#Name").val(param.Name);  $("#Age").val(param.Age);});function closeWindow() {  var result = {};  result.Name = $("#Name").val();  result.Age = $("#Age").val();  window.returnValue = result;  window.close();}</script></head><body>  <div>    名字<input id="Name" type="text" /><br />    年龄<input id="Age" type="text" /><br />    <input id="Button1" type="button" value="关闭模式窗口" onclick="closeWindow()" />  </div></body></html>

更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery操作xml技巧总结》、《jQuery拖拽特效与技巧总结》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》、《jQuery动画与特效用法总结》、《jquery选择器用法总结》及《jQuery常用插件及用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

上一篇：JS显示日历和天气的方法

下一篇：jQuery获取某天的农历日期并判断是否除夕或新年的方法