基于jQuery實現(xiàn)點擊同時更改兩個iframe的網(wǎng)址
更新時間：2010年07月01日 16:37:00 作者：
最近寫了兩個管理后臺的前端頁面,其中有一個管理后臺,左側菜單導航和右側內(nèi)容頁是兩個iframe,需求是,點擊上面的主導航時,左側iframe和右側iframe調(diào)用不同的鏈接.
個人推薦用jQuery實現(xiàn),代碼簡潔,擴展性強.
jQuery部分:
function gotourl(url_a, url_b)
{
$('#ifr_a').get(0).src = url_a;
$('#ifr_b').get(0).src = url_b;
}
html調(diào)用:
<a href="javascript:void(0)" onClick="gotourl('http://g.cn/','http://baidu.com');">點我下面兩個iframe內(nèi)容都會變</a>
<iframe src="http://jb51.net/" id="ifr_a" name="ifr_a" frameborder="0"></iframe>
<iframe src="http://s.jb51.net/" id="ifr_b" name="ifr_b" frameborder="0"></iframe>
通過js判斷iframe的id,然后給不同id賦不同的src值也可以實現(xiàn),但代碼相對復雜一點.
原文發(fā)布于Mr.Think的個人博客: http://mrthink.net/javascript-jquery-twourl-twoifram/
jQuery部分:
復制代碼 代碼如下:
function gotourl(url_a, url_b)
{
$('#ifr_a').get(0).src = url_a;
$('#ifr_b').get(0).src = url_b;
}
html調(diào)用:
<a href="javascript:void(0)" onClick="gotourl('http://g.cn/','http://baidu.com');">點我下面兩個iframe內(nèi)容都會變</a>
<iframe src="http://jb51.net/" id="ifr_a" name="ifr_a" frameborder="0"></iframe>
<iframe src="http://s.jb51.net/" id="ifr_b" name="ifr_b" frameborder="0"></iframe>
通過js判斷iframe的id,然后給不同id賦不同的src值也可以實現(xiàn),但代碼相對復雜一點.
原文發(fā)布于Mr.Think的個人博客: http://mrthink.net/javascript-jquery-twourl-twoifram/
相關文章
這篇文章主要介紹了jQuery Ajax通用js封裝的實例代碼，非常不錯，具有參考借鑒價值，感興趣的朋友一起學習吧2016-06-06
jQuery.cookie.js使用方法及相關參數(shù)解釋
一個輕量級的cookie 插件，可以讀取、寫入、刪除 cookie。這篇文章主要介紹了jQuery.cookie.js使用方法及相關參數(shù)解釋,需要的朋友可以參考下2017-03-03
這篇文章主要介紹了jQuery中addClass()方法用法,實例分析了addClass()方法的功能、定義及向匹配元素添加一個或多個類的使用技巧,需要的朋友可以參考下2015-01-01
jQuery實現(xiàn)滾動到底部時自動加載更多的方法示例
這篇文章主要介紹了jQuery實現(xiàn)滾動到底部時自動加載更多的方法,涉及jQuery基于ajax動態(tài)操作頁面元素相關實現(xiàn)技巧,需要的朋友可以參考下2018-02-02
在jQuery里面對于一些HTML的元素操作都是很簡化的，這也是很多人選擇使用jQuery的原因。2009-11-11
這篇文章主要介紹了jQuery判斷數(shù)組是否包含了指定的元素的方法,需要的朋友可以參考下2015-03-03
本文給大家介紹的是一款使用jQuery實現(xiàn)的簡易選項卡的代碼，通過控制css熟悉來實現(xiàn)tab切換，思路清晰，這里推薦給大家。2015-03-03
使用jquery為a連接綁定點擊事件，具體代碼如下，感興趣的朋友可以參考下，希望可以幫助到你2013-05-05
這篇文章主要為大家詳細介紹了jQuery層級選擇器實例代碼，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-02-02
jquery實現(xiàn)兩個div中的元素相互拖動的方法分析
這篇文章主要介紹了jquery實現(xiàn)兩個div中的元素相互拖動的方法,結合實例形式分析了jQuery基于鼠標事件響應的頁面元素屬性動態(tài)操作相關實現(xiàn)技巧,需要的朋友可以參考下2020-04-04