iframe中使用jquery查找

原创 2013年12月04日 09:53:33

今天在公司是给ckeditor添加一个“是否显示”图片标题的功能


难点:插件的内容很多,功能相当强大,在短时间之内无法通读和理解里面的逻辑关系,而且修改的内容不能破坏插件内部的逻辑关系,不能因为添加一个功能而引入更多的问题,因此只能从局部去解决这个问题


突破口:知道页面时使用iframe框架插入的html,页面有些初始化的功能是在这里完成的,因此在这里添加这个checkbox组件,然后根据最后的window去寻找自己想要处理的window对象——window.parent.document.body

 

jQuery(expression, [context])——如果指定了 context 参数,如一个 DOM 元素集或 jQuery 对象,那就会在这个 context 中查找。


下面这个例子就是想在iframe的父窗口中添加组件

$('tr.cke_dialog_ui_hbox', parent.document.body).prepend('<td><input type="checkbox" id="show_img_title" class="cke_dialog_ui_hbox_first">照片标题描述带入日记</td>');

 

不能在闭包里面去访问动态添加的组件,因为在页面加载的时候就已经运行了闭包里面的东西,但是页面还没有添加ID为kkkk的组件,使用$("#kkkk")得到的值就为空,这样不能实现预期的目的,出现异常的现象,在浏览器中会报脚本错误


如何判断jquery是否查找到符合条件的对象?

if(0==$(".check_show_img_title", parent.document.body).length){
     alert("没有查找到对象");
}else{
    alert("有"+$(".check_show_img_title", parent.document.body).length+"组件符合查询条件");
}

 

经验之谈:
在页面中动态添加了组件之后,由于刷新页面就恢复了正常初始化的状态,但是如果是局部刷新,可能会添加多个组件,但是如果只需要一个组件,则就是在离开页面的时候删除自己动态添加的组件,这样问题就来了,可能在不同的浏览器中不能删除,这样就会很郁闷,产生出浏览器兼容的问题,既然是这样那么可以换一种思维方式,在某种状态(在标签中添加属性)下就添加,否则就不添加,这样就不用去删除自己添加的组件了,换种方式解决了浏览器兼容的问题

 

Jquery取得iframe中元素的几种方法Javascript Jquery获取Iframe的元素、内容或者ID

query取得iframe中元素的几种方法 在iframe子页面获取父页面元素 代码如下: $('#objId', parent.document); // 搞定... ...
  • kaixuanfeng2012
  • kaixuanfeng2012
  • 2015年04月24日 00:43
  • 27221

jquery里的dialog对话框插件为框架页(iframe) 的方法

(function ($) { $.fn.openWidow = function (options) { var divId = "dialog" + Math.round(...
  • zhangfeng1133
  • zhangfeng1133
  • 2015年08月02日 09:56
  • 1845

jquery刷新iframe页面的方法

http://www.3lian.com/edu/2014/10-18/173159.html *******************************    1,reload 方法,该方法强...
  • zhao1949
  • zhao1949
  • 2017年02月20日 15:32
  • 2368

jquery插件封装:弹出iframe模式框

在web开发过程中我们经常需要弹出Iframe页面来加载另外一个页面来显示操作或显示数据,在关闭iframe后又是需要执行某一个回调函数。以下插件能够以较少的代码实现该功能并具有较好的扩展性。下...
  • oTengYue
  • oTengYue
  • 2015年08月30日 21:13
  • 4332

jQuery弹出Iframe窗口,应该比$.dialog好用

核心代码如下:/** * iframe弹出层 例子:openDialogByIframe(550,450,'新建单位','add.do'); * * @param width * ...
  • xzknet
  • xzknet
  • 2015年02月11日 09:31
  • 6890

Jquery 操作iframe中元素

query取得iframe中元素的几种方法 在iframe子页面获取父页面元素代码如下:$('#objId', parent.document);// 搞定...在父页面 获取iframe子页面的元素...
  • forest_fire
  • forest_fire
  • 2016年03月21日 11:17
  • 1585

多iframe使用tab标签方式添加、删除、切换的处理实例

紧接着上一篇随笔iframe的内容增高或缩减时设置其iframe的高度的处理方案      如果采用iframe来切换显示内容的方式来展现办公Web。那么需要解决几个问题   1.tab标签需要...
  • chen_hua89
  • chen_hua89
  • 2016年03月08日 09:25
  • 3566

判断 iframe 是否加载完成的完美方法

 一般来说,我们判断 iframe 是否加载完成其实与 判断 JavaScript 文件是否加载完成 采用的方法很类似: var iframe = document.createEle...
  • mss359681091
  • mss359681091
  • 2016年04月06日 11:37
  • 5370

Js/Jquery获取iframe中的元素

在web开发中,经常会用到iframe,难免会碰到需要在父窗口中使用iframe中的元素、或者在iframe框架中使用父窗口的元素。 js 在父窗口中获取iframe中的元素 1. Js代码...
  • liaozhongping
  • liaozhongping
  • 2015年09月18日 10:22
  • 2506

jquery load方法把一个页面载入到主页面的一个div中替换iframe

jquery load方法把一个页面载入到主页面的一个div中,载入页面的javascript消失了  如果绑定给window对象,则会在所有内容加载后触发,包括窗口,框架,对象...
  • qq_32447321
  • qq_32447321
  • 2017年03月21日 10:14
  • 2516
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:iframe中使用jquery查找
举报原因:
原因补充:

(最多只允许输入30个字)