jQuery中iframe的操作(点击按钮新增窗口)
更新时间：2016年04月20日 17:13:02 作者：山一程
<iframe>也应该是框架的一种形式，它与<frame>不同的是，iframe可以嵌在网页中的任意部分。本文给大家介绍jQuery中iframe的操作(点击按钮新增窗口)，需要的朋友参考下吧
<iframe>也应该是框架的一种形式，它与<frame>不同的是，iframe可以嵌在网页中的任意部分。
今天遇到一个问题：怎样实现点击一个按钮，在当前的页面上新增加一个小窗口，展示一个图片信息？
如下图所示：
点击之前：
单击之后：
分析：要使新增的小窗口不影响父页面，我们这里采用iframe的框架的技术。
【<iframe>也应该是框架的一种形式，它与<frame>不同的是，iframe可以嵌在网页中的任意部分。】
实现是思路：（1）在按钮的上添加一个点击的事件，在点击后加入一个iframe窗口，并将生成图片的地址加上去即可。
具体实现的代码：
（1）给按钮加上点击事件：
<input type="radio" name="dynamicType" id="dianji" style="padding: 0 10px 0 5px;margin-left:10px;margin-top: 13px;"/>
<p class="loadPhoto"></p>
$("#dianji").click(function(){
$("p.loadPhoto").empty(); // 清空原来的p标签的中内容
$("p.loadPhoto").html("<iframe width=520 height=400 name=\"touzizuhe\" id=\"touzizuhe\" frameborder=0 src="生成图片的地址"></iframe>");// 添加iframe的jquery的语句
});
注意：这里iframe的开发之后，会自动的去访问生成图片的地址，这样图片的生成的需求就满足了。
有关jQuery中iframe的操作(点击按钮新增窗口)就给大家介绍这么多，希望对大家有所帮助！
相关文章
这篇文章主要介绍了jQuery实现左右切换焦点图的核心代码，有需要的小伙伴可以参考下2015-04-04
这篇文章主要介绍了jquery实现点击浏览器返回上一页按钮并能直接刷新，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-12-12
jQuery操作attr、prop、val()/text()/html()、class属性
这篇文章主要介绍了jQuery操作attr、prop、val()/text()/html()、class属性 ，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下2019-05-05
这篇文章主要介绍了基于jQuery实现拖拽图标到回收站并删除功能，实现非常简单，我们直接可以利用jQuery内部封装的拖拽接口即可简单实现在网页上拖拽任意元素的功能，感兴趣的小伙伴们可以参考一下2015-11-11
使用jquery读取html5 localstorage的值的方法
在HTML 5中，localstorage是个不错的东西，在支持localstorage的浏览器中， 能持久化用户表单的输入，即使关掉浏览器，下次重新打开浏览器访问，也能读出其值,很不错的一个东西，接下来实例介绍，需要的朋友可以参考下2013-01-01
本文主要给大家介绍的是jQuery对象与DOM对象之间的相互转换的方法和示例，非常实用，这里推荐给有需要的小伙伴参考下。2015-03-03
从DOM中删除所有匹配的元素。这个方法不会把匹配的元素从jQuery对象中删除，因而可以在将来再使用这些匹配的元素。但除了这个元素本身得以保留之外，其他的比如绑定的事件，附加的数据等都会被移除。我的理解就是将元素移除了。2015-08-08
下面小编就为大家带来一篇深入理解$.each和$(selector).each。小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-05-05![[jQuery] 事件和动画详解](//img.jbzj.com/images/xgimg/bcimg8.png)
这篇文章主要介绍了JQ事件和动画，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-03-03
将滚动的内容查询出来，放在一个div 或者别的容器里面，具体的实现代码如下2014-06-06
![[jQuery] 事件和动画详解](http://img.jbzj.com/images/xgimg/bcimg8.png)
最新评论