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插件nyroModal在iframe中的使用

  • 2011年09月09日 19:12
  • 99KB
  • 下载

使用Jquery向一个空白网页动态创建一个iframe,及嵌入页面,和向嵌入页面传参

using Microsoft.VisualBasic; using System; using System.Collections; using System.Collections.Generi...
  • lee576
  • lee576
  • 2012年02月15日 09:53
  • 14023

Django+Jquery+Bootstrap Modal+Iframe使用异步机制上传文件实现方法

需求: 1. 现在有一个采用Jquery + Bootstrap做前端,Django+Apache做后端的站点; 2. 使用Bootstrap Modal弹出模态框提示用户上传文件,点击上传按钮后,不...
  • samed
  • samed
  • 2015年12月16日 10:34
  • 2097

使用jquery操作iframe

使用jquery操作iframe 1、 内容里有两个ifame
  • wkcgy
  • wkcgy
  • 2011年05月03日 10:32
  • 556

[JavaScript]使用jquery获取iframe加载完成事件

使用jquery获取iframe加载完成事件 网页中的iframe加载完成后,希望做一些工作。比如在iframe内容改变前在某处显示"正在加载",在加载完成后,显示内容改为"加载完成"。那么该怎么处...
  • szwangdf
  • szwangdf
  • 2011年12月24日 11:38
  • 33730

jquery tab 切换页面 支持iframe

  • 2011年11月12日 14:57
  • 45KB
  • 下载

jquery 插件 图片浏览 支持跨iframe

  • 2011年04月02日 09:02
  • 212KB
  • 下载

JS+JQuery实现任意意嵌套的IFrame里鼠标相对于浏览器窗体坐标

iframe用过的都人都知道,iframe是一个事件无法向上级冒泡二期交互并不是那么方便的一个html元素,但是时至今日他独特的功能还是会出现在不少开发中,有时我们需要获取任何一个不定的iframe中...

jquery选项 iframe选项卡

  • 2016年05月18日 09:32
  • 99KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:iframe中使用jquery查找
举报原因:
原因补充:

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