iframe中使用jquery進(jìn)行查找的方法【案例分析】
本文實(shí)例講述了iframe中使用jquery進(jìn)行查找的方法。分享給大家供大家參考,具體如下:
問題:
今天在公司是給ckeditor添加一個(gè)“是否顯示”圖片標(biāo)題的功能
難點(diǎn):
插件的內(nèi)容很多,功能相當(dāng)強(qiáng)大,在短時(shí)間之內(nèi)無法通讀和理解里面的邏輯關(guān)系,而且修改的內(nèi)容不能破壞插件內(nèi)部的邏輯關(guān)系,不能因?yàn)樘砑右粋€(gè)功能而引入更多的問題,因此只能從局部去解決這個(gè)問題
突破口:
知道頁面時(shí)使用iframe框架插入的html,頁面有些初始化的功能是在這里完成的,因此在這里添加這個(gè)checkbox組件,然后根據(jù)最后的window去尋找自己想要處理的window對(duì)象——window.parent.document.body
jQuery(expression, [context])——如果指定了 context 參數(shù),如一個(gè) DOM 元素集或 jQuery 對(duì)象,那就會(huì)在這個(gè) context 中查找。
下面這個(gè)例子就是想在iframe的父窗口中添加組件
不能在閉包里面去訪問動(dòng)態(tài)添加的組件,因?yàn)樵陧撁婕虞d的時(shí)候就已經(jīng)運(yùn)行了閉包里面的東西,但是頁面還沒有添加ID為kkkk的組件,使用$("#kkkk")得到的值就為空,這樣不能實(shí)現(xiàn)預(yù)期的目的,出現(xiàn)異常的現(xiàn)象,在瀏覽器中會(huì)報(bào)腳本錯(cuò)誤
如何判斷jquery是否查找到符合條件的對(duì)象?
if(0==$(".check_show_img_title", parent.document.body).length){ alert("沒有查找到對(duì)象"); }else{ alert("有"+$(".check_show_img_title", parent.document.body).length+"組件符合查詢條件"); }
經(jīng)驗(yàn)之談:
在頁面中動(dòng)態(tài)添加了組件之后,由于刷新頁面就恢復(fù)了正常初始化的狀態(tài),但是如果是局部刷新,可能會(huì)添加多個(gè)組件,但是如果只需要一個(gè)組件,則就是在離開頁面的時(shí)候刪除自己動(dòng)態(tài)添加的組件,這樣問題就來了,可能在不同的瀏覽器中不能刪除,這樣就會(huì)很郁悶,產(chǎn)生出瀏覽器兼容的問題,既然是這樣那么可以換一種思維方式,在某種狀態(tài)(在標(biāo)簽中添加屬性)下就添加,否則就不添加,這樣就不用去刪除自己添加的組件了,換種方式解決了瀏覽器兼容的問題
更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《jQuery常用插件及用法總結(jié)》、《jquery中Ajax用法總結(jié)》、《jQuery表格(table)操作技巧匯總》、《jQuery拖拽特效與技巧總結(jié)》、《jQuery擴(kuò)展技巧總結(jié)》、《jQuery常見經(jīng)典特效匯總》、《jQuery動(dòng)畫與特效用法總結(jié)》及《jquery選擇器用法總結(jié)》
希望本文所述對(duì)大家jQuery程序設(shè)計(jì)有所幫助。
相關(guān)文章
jQuery通過改變input的type屬性實(shí)現(xiàn)密碼顯示隱藏切換功能
大家在做登錄注冊(cè)功能的時(shí)候都會(huì)遇到用戶選擇自己輸入的密碼是否顯示需求,大家都是怎么實(shí)現(xiàn)的呢?今天小編給大家分享一種比較好用的方法jQuery通過改變input的type屬性實(shí)現(xiàn)密碼顯示隱藏切換功能,需要的朋友參考下2017-02-02制作高質(zhì)量的JQuery Plugin 插件的方法
最近jquery非常流行,想個(gè)性化定制一些功能,就可以將代碼寫成插件的形式,方便使用與修改。2010-04-04jQuery中設(shè)置form表單中action值的實(shí)現(xiàn)方法
下面小編就為大家?guī)硪黄猨Query中設(shè)置form表單中action值的實(shí)現(xiàn)方法。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-05-05jquery對(duì)table中各數(shù)據(jù)的增加、保存、刪除操作示例
這篇文章主要介紹了jquery對(duì)table中各種數(shù)據(jù)的增加、保存、刪除操作,需要的朋友可以參考下2014-05-05使用BootStrap和Metroui設(shè)計(jì)的metro風(fēng)格微網(wǎng)站或手機(jī)app界面
今天使用bootstrap和metroui設(shè)計(jì)了一個(gè)metro風(fēng)格的移動(dòng)app或者微信微網(wǎng)站的界面,非常不錯(cuò)具有參考借鑒價(jià)值,感興趣的朋友可以參考下2016-10-10jquery ui resize 中border-box的bug修正
本文給大家分享的是jQuery ui resize中的一個(gè)樣式的小bug的解決方法,官方并沒有修復(fù),這里推薦給大家,有需要的小伙伴可以參考下。2015-04-04基于jquery的finkyUI插件與Ajax實(shí)現(xiàn)頁面數(shù)據(jù)加載功能
基于jquery的finkyUI插件與Ajax實(shí)現(xiàn)頁面數(shù)據(jù)加載功能,需要的朋友可以參考下。2010-12-12