iframe異步加載實現(xiàn)點擊左邊菜單加載右邊內(nèi)容實例講解
更新時間：2013年03月04日 14:47:57 作者：
iframe異步加載想必很多朋友對你都不會陌生,接下來將實現(xiàn)這樣一個功能左邊菜單不能刷新的情況下，異步加載右邊的內(nèi)容頁面，感興趣的你可以參考下本文或許對你有所幫助
關于iframe異步加載，我們常用的大都是左邊菜單欄右邊是內(nèi)容頁面，要求我們不能左邊菜單不能刷新的情況下，異步加載右邊的內(nèi)容頁面。
話不多說，做了一個實例大致是這樣的：
1、首先在你的項目中建立三個文件如：
2、在Default頁面引入jquery文件并在body中加入也下代碼：
復制代碼 代碼如下:
<div style="width: 20%; float: left">
<div id="butten" style="cursor: pointer;">
局部刷新(框架加載頁面)
</div>
<div id="hidden" style="display: none">
我是隱藏的，點擊局部刷新之后<br />
我就顯示，頁面加載我不會消失
</div>
</div>
<div id="page" style="width: 80%; float: right;">
<iframe src='1.htm' frameborder='0' style='border: 0; width: 100%; height: 99.4%;'>
</iframe>
</div>
<script type="text/javascript">
$(function () {
$("#butten").click(function () {
$("#hidden").show();
$("iframe").attr("src", "2.htm");
});
});
</script>
3、在1.htm和2.htm中隨便寫上什么都行，甚至可以直接這樣寫（什么html、title、body、title等均可不用寫）：
1.htm：
復制代碼 代碼如下:
頁面一<br />
原始頁面
2.htm：
復制代碼 代碼如下:
頁面二<br />
框架加載的頁面
4、效果如圖：
相關文章
這篇文章主要介紹了jQuery+css實現(xiàn)的切換圖片功能代碼,涉及jQuery響應鼠標事件動態(tài)變換頁面元素樣式的相關技巧,需要的朋友可以參考下2016-01-01
jQuery 是一個非常優(yōu)秀的 JavaScript 框架，使用簡單靈活，同時還有許多成熟的插件可供選擇，它可以幫助你在項目中加入一些非常好的效果2012-01-01
通過JQuery實現(xiàn)win8一樣酷炫的動態(tài)磁貼效果(示例代碼)
相信大家喜歡這個界面無非也是喜歡它的動態(tài)磁貼。剛好今天研究了一下如何通過JQuery在網(wǎng)頁上模仿這種效果，就貼出來給大家噴一下。雖然是一些很低級的技術，但是也希望有需要的朋友可以參考下2013-07-07
jQuery 獲取URL的GET參數(shù)值的小例子，需要的朋友可以參考一下2013-04-04
Jquery與JS兩種方法仿twitter/新浪微博 高度自適應無縫滾動實現(xiàn)代碼
Jquery與JS兩種方法仿twitter/新浪微博 高度自適應無縫滾動的實現(xiàn)代碼，需要的朋友可以參考下。2010-11-11
jquery support主要是檢測瀏覽器兼容性，支持力度的方法，用于展示不同瀏覽器各自特性和bug的屬性集合。作為一個靜態(tài)成員，提供給jquery內(nèi)部函數(shù)，告訴他們某些功能是否能用。避免了以往通過檢測瀏覽器版本做修改。下面我們通過源碼詳細解讀jQ中瀏覽器兼容模塊support。2016-08-08
jQuery實現(xiàn)信息提示框(帶有圓角框與動畫)效果
這篇文章主要介紹了jQuery實現(xiàn)信息提示框效果,帶有圓角框與動畫功能,點擊上面按鈕實現(xiàn)對應文字的漸變顯示效果,非常具有實用價值,需要的朋友可以參考下2015-08-08
這篇文章主要為大家詳細介紹了jQuery拖拽通過八個點改變div大小，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-12-12
這篇文章主要為大家詳細介紹了jQuery實現(xiàn)消息彈出框效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-12-12
基于twbsPagination.js分頁插件使用心得(分享)
下面小編就為大家?guī)硪黄趖wbsPagination.js分頁插件使用心得(分享)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-10-10