javascript 常用方法

1.iframe 父子窗口之间传递值和方法调用

iframe之间可以通过javascript来实现传递值和方法,直接上代码

parent.htm

<!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>iframe之间传值与方法调用</title><script src="JavaScript/JQuery/jquery-1.4.2.js" type="text/javascript"></script><style type="text/css">body{font-size:9pt;}</style><script type="text/javascript">function getSonValue() {var sontxtName = window.frames["sonframe"].document.getElementById("txtSonName");var parentName = document.getElementById("txtName");parentName.value = sontxtName.value;}function parentAlert() {alert("我来自父页面！");}function getSonAlert() {return window.frames["sonframe"].sonAlert();}function getSonValueJquery() {$("#txtName").val($("#txtSonName", window.frames["sonframe"].document).val());}</script>
</head>
<body>
<fieldset>
<legend>调用子页面值</legend>
<input type="button" value="点我" οnclick="getSonValue()" />
<input type="button" value="点我(Jquery)" οnclick="getSonValueJquery()" />
<input type="text" id="txtName"  name="txtName"/>
</fieldset>
<fieldset>
<legend>调用子页面方法</legend>
<input type="button" value="点我" οnclick="getSonAlert()" />
</fieldset>
<fieldset>
<legend>子页面</legend>
<iframe name="sonframe" id="sonframe" src="Son.htm" height="500px" width="500px" frameborder=0></iframe>
</fieldset></body>
</html>

son.htm

<!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="JavaScript/JQuery/jquery-1.4.2.js" type="text/javascript"></script><script type="text/javascript">function getParentValue() {var parentName = window.parent.document.getElementById("txtName");var sonName = document.getElementById("txtSonName");sonName.value = parentName.value;}function getParentJqueryValue() {$("#txtSonName").val($("#txtName", window.parent.document).val());}function sonAlert() {alert("我来自子页面！");}function getParentAlert() {return window.parent.parentAlert();}</script>
</head>
<body>
<fieldset>
<legend>调用父页面值</legend>
<input type="button" value="点我" οnclick="getParentValue()" />
<input type="button" value="点我(Jquery)" οnclick="getParentJqueryValue()" />
<input type="text" id="txtSonName"  name="txtSonName"/>
</fieldset>
<fieldset>
<legend>调用父页面方法</legend>
<input type="button" value="点我" οnclick="getParentAlert()" />
</fieldset>
</body>
</html>

转载于:https://www.cnblogs.com/tedyding/archive/2010/04/20/1716696.html

javascript 常用方法相关推荐

JavaScript 常用方法封装使用
1. 删除数组中指定元素 Array.prototype.remove = function(val) {let index = this.indexOf(val);if (index > -1 ...
JQuery和JavaScript常用方法的一些区别
jquery 就对javascript的一个扩展,封装,就是让javascript更好用,更简单,为了说明区别,下面与大家分享下JavaScript 与JQuery 常用方法比较 jquery 就对j ...
javascript常用方法 – String
// 1.长字符串 // 1.1 let longString1 = "This is a very long string which needs " + "to wr ...
HTML5左取函数,Javascript常用方法函数收集（一）
本文中,收集了一些比较常用的Javascript函数,希望对学习JS的朋友们有所帮助. 1.字符串长度截取 function cutstr(str, len) { var temp, icount = ...
javascript常用方法函数收集
收集了一些比较常用的javascript函数. 字符串长度截取 js 代码: function cutstr(str, len) { var temp, icount = 0, patrn = /[^ ...
【时空智友】JavaScript 常用方法（合集）
文章目录一.全选.全取消.反向选择 1.全选 2.全取消 3.反向选择二.导出Excel模板.导入Excel表格 1.导出Excel模板 2.导入Excel表格三.查询表单打印.打印预览 1.打 ...
Javascript常用方法备份
本文仅作常用Javascript方法备份,部分可能采用typescript写法. 1.小驼峰格式转换许多后端语言都习惯采用大驼峰命名方式,而前端代码多采用小驼峰方式,此时就需要在收到后端数据后进行格 ...
JavaScript常用方法（工具类的封装）
日期格式化 function formatDateTime(timeStamp) { var date = new Date(); date.setTime(timeStamp); var y = d ...
javascript中最最最常用的方法封装
javascript 常用方法的封装,小编持续升级中... 方法封装(js原生): 一.Object 类型 MHQ.ajaxUtils 定义一个ajax工具类 ajax 定义一个ajax工具函数 ge ...

javascript 常用方法

1.iframe 父子窗口之间传递值和方法调用

javascript 常用方法相关推荐

最新文章

热门文章