本文實例講述了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程序設計有所幫助。
新聞熱點
疑難解答
