想要让网页应用的某页功能在其他地方也能用到怎么办？不用慌，有个神奇软件叫做jQuery就能帮你搞定！下面就通过一些例子来教你们怎么使用它解决这个问题。比如怎样在父亲页面设个方法，以及如何在儿子页面拿到父亲页面的引用并调用其方法，还有另一种处理父亲页面方法的小技巧等。
父页面中定义方法
是不是觉得在父页写点小脚本真的超方便？比如，搞些函数出来，放在子页面里就能用得溜溜转；处理那些乱七八糟的业务逻辑也不在话下，甚至可以随便改改网页内容。比如说，我们在父页创建个叫”displayMessage()”的函数，运行后就能弹个对话框，给用户提供重要信息哩！这样设计，我们的网站既好玩又实用，岂不美哉！
function displayMessage(){
alert("Hello from parent page!");
}
Open Child Page
首先咱们商量好规则，让你的JavaScript技术和逻辑在老爸（父页面）上大显身手，让他变强大！然后把东西理清楚，让子页（子页面）也能方便使用。这样就不用重复写同个代码和拼接逻辑
子页面获取父页面引用
想要从子页跳到上一层，其实不难，只要找到father-child（上下级）链接搞定即可！这时候我们还需要个叫做window.parent的大哥来帮忙。搞定了这些，子页就可以随心所欲地享用父页的所有东西！
$(document).ready(function(){
var parentWindow = window.parent;
});
当我们使用jQuery的时候，用document.ready()这个方法就行，它会等网页全部加载完才开始运行我们的代码。这样就能防止因为DOM元素没准备好，导致我们找不到父窗口的情况发生！
子页面调用父页面方法
$(document).ready(function(){
var parentWindow = window.parent;
parentWindow.displayMessage();
});
搞定了父页的指针后，子页就能尽情玩转爸爸页面的各种厉害功能。就跟跟小伙伴玩耍似的，只需用上父页里叫window.parent的小工具，子页就能轻松地和父页函数打成一片！
嘿~你想把大页面里面的displayMessage()函数搬到小页面上用？那太简单了！随便复制粘贴就能搞定。这么一来，不论在哪儿都能用这些函数，真是方便得很！
另一种方法执行父页面方法
想在父子窗之间快速传消息？除了用window.parent，还有一招简单粗暴的方法——靠儿子窗的window.opener属性来找“创建者”或者说creator只要你家窗口是自个跑出来的，那这个属性就能派上大用场了。但是，切记别挪窝或换位置，不然还是白搭哦～
你可能还不晓得？通过window.opener这玩意儿，子窗口就能轻松找到并搞掂它那开了窗的老爸窗口！特别是用在弹窗、对话框等跟网页常常互动的时候，真的超级好用哟~
Parent Page
function displayMessage(){
alert("Hello from parent page!")
}
网页制作中，子页怎么才能访问到父页？别担心，有jQuery在手，这都不是事儿！它功能强大又好用，帮你轻松解决。这儿给你介绍两种常见方法：不管是window.parent还是window.opener，都能满足你各种情况下的跨窗函数调用和数据传输需求！
$(document).ready(function(){
var parentWindow = window.opener;
parentWindow.displayMessage();
});
评论0