本人第一次发表博文,没有经验写的不好,大家见谅!
本文主要介绍一下jquery中使用iframe标签,如何通过iframe的页面给父页面中的元素赋值功能。
例子：
1、父页面
<!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 runat="server">
<title>父页面</title>
<script language="javascript" type="text/javascript" src="jquery-1.7.1.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div id="default" style=" width:200px; height:400px; float:left;">default</div>
<iframe id="iframe" src="b.html" style=" width:500px; height:200px; float:left;"></iframe>
</div>
</form>
</body>
</html>
2、iframe页面
<!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 runat="server">
<title>iframe页面</title>
<script language="javascript" type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script language="javascript" type="text/javascript">
function setHtml() {
//在iframe中给父页面元素赋值
$('#default', window.parent.document).html("给父页面赋值!");
}
</script>
</head>
<body>
<form id="form1" runat="server">
<input type="button" id="button" value="给父页面赋值" onclick="setHtml();"/>
</form>
</body>
</html>
ps:在iframe中操作父页面元素的方法是$('#id', window.parent.document) id是父页面中元素的id
分享到：
相关推荐
// 更新父页面元素的值 parent.updateParentData(value); // 调用父页面的更新函数 parent.window('close'); // 关闭窗口 } ``` 在这个例子中，`#parentElementId`是父页面中需要更新的元素ID，`...
在网页开发中，有时我们需要在父页面中与嵌入的iframe子页面进行交互，例如调用子页面中的特定方法或修改子页面的某些元素。jQuery提供了一种方便的方式来实现这样的功能，尤其当我们知道iframe的ID时。本篇将详细...
当页面嵌套在多个 `iframe` 中时，`top.location.reload()` 可用于刷新最外层的页面。 **刷新弹出窗口：** ```javascript opener.location.reload(); ``` 如果页面是通过 `window.open()` 打开的新窗口，则可以...
**获取父页面元素并赋值** - **JavaScript方法**: 使用 `parent.window.document.getElementById("msg")` 获取父页面的元素，并通过 `innerHTML` 设置内容。 - **jQuery方法**: 利用 `$("#msg", parent.window....
使用jQuery，我们可以通过修改`<iframe>`元素的`src`属性来改变加载的页面。当用户点击树形菜单中的某个链接时，对应的PDF路径会被赋值给`src`，从而在iframe中显示该PDF。 实现这个功能的关键步骤包括： 1. **...
3. 在子iframe页面中使用window.parent对象调用父页面的函数或修改父页面的DOM元素。 4. 当需要跨嵌套iframe调用函数时，仍使用window.parent对象访问上层iframe。 5. 对于不同源的iframe通信，使用window.post...
在网页设计中，iframe标签是一个非常实用的元素，它允许我们轻松地将一个外部网页嵌入到当前的页面中。这种嵌入方式可以为网页设计带来诸多便利，例如展示第三方内容、嵌入视频播放器、地图以及其他可以嵌入的资源。...
总结来说，面对layer的iframe弹窗中的数据赋值问题，我们可以借助jQuery选择器和DOM操作，结合layer提供的API，有效地将主页面的数据传递给弹窗页面，并为其中的标签赋值。这种方法既简单又实用，是解决此类问题的一...
在ASP.NET开发中，"画图，引用页面"这一主题主要涉及到两个关键点：一是如何在网页上进行图形绘制，二是如何通过`div`元素来引用其他页面。这两个知识点是构建交互式和动态Web应用程序的重要组成部分。 首先，我们...
在函数s中，通过document.getElementById获取到id为hello的span标签，并使用innerHTML属性将一个iframe元素赋值给它。 2. 使用innerText属性 innerText属性用于获取或设置位于对象起始和结束标签内的文本，忽略所有...
一种常见方法是使用JavaScript或者jQuery监听`iframe`的`load`事件，当`iframe`内容加载完成后，动态获取其内容的高度并赋值给`iframe`的高度。以下是一个使用jQuery的例子： ```javascript $(document).ready...
然后定义一个函数frameReady，用于接收子页面传递过来的window对象并将其赋值给window.iframeWindow。 - 子页面代码中使用$(function(){})这种模式（即文档加载完毕后执行）来调用父页面的frameReady函数，并传递...
* Tip2：规范地获取 DOM 对象，能避免 IE 的一些默认行为导致的，能获取到 DOM 对象的假象，如 IE 使用 iframe 的 id 作为变量名获取到的不是 DOM 对象，而是在 chrome 中获取到的是对应 iframe 的 DOM 对象，导致...
总而言之，文章中提供的方法展示了如何使用JavaScript和jQuery来控制iframe的大小，以适应不同浏览器窗口的大小，这对于开发中需要嵌入外部网页内容而又不希望用户离开当前页面的场景非常有用。通过合理使用iframe，...
- 将要设置的HTML内容先存储在一个`<textarea>`元素中，再通过JavaScript获取并设置给编辑器。 这些方法都是基于对问题成因的理解而设计的解决方案。 #### 三、解决方案 针对上述问题，我们可以通过以下几个方面...
在jQuery中，可以通过别名的方式来避免命名冲突，例如将`jQuery`对象赋值给一个不同的变量名（如`$j`），从而在项目中避免冲突。 #### 8. 克隆表格头部信息到表格底部 为了提高表格的可读性，常常需要在表格底部...
为了使子框架能够访问父框架中的`veriAddData`方法，我们需要将这个方法赋值给子框架的window对象。对于不同版本的浏览器，处理方式有所不同： - 对于IE8以下的浏览器（不支持`window.postMessage`），我们可以直接...
2. **Content 方式**：直接将 HTML 代码或 `iframe` 对象赋值给 `content` 属性。这种方法更灵活，可以直接拼接 HTML 或嵌入整个页面，但可能导致代码可读性下降，且使用 `iframe` 可能导致客户端 JS 库重复加载，...