快捷導(dǎo)航

js判斷iframe內(nèi)的網(wǎng)頁(yè)是否滾動(dòng)到底部觸發(fā)事件

更新時(shí)間：2014年03月18日 10:51:11 作者：

這篇文章主要介紹了js判斷iframe內(nèi)的網(wǎng)頁(yè)是否滾動(dòng)到底部觸發(fā)事件,需要的朋友可以參考下

之前有個(gè)需求是要判斷iframe內(nèi)的網(wǎng)頁(yè)是否滾動(dòng)到底部觸發(fā)事件, 網(wǎng)上找了許多資料都是說(shuō)在當(dāng)前頁(yè)面下的, 索性就自己研究了一下, 找到了解決方法.

clientHeight：這個(gè)元素的高度，占用整個(gè)空間的高度

offsetHeight：是指元素內(nèi)容的高度

scrollTop：可以理解為滾動(dòng)條可以滾動(dòng)的長(zhǎng)度

以下是源代碼

復(fù)制代碼代碼如下:

 
<iframe src="~/Files/3.html" id="iframepage" width="825" onload="func()"></iframe> 
<script type="text/javascript"> 
function func() { 
var ifm = document.getElementById("iframepage"); 
ifm.height = window.document.body.clientHeight - 100; 
} 
<!--在chrome有兼容問(wèn)題，F(xiàn)F和IE10無(wú)問(wèn)題，網(wǎng)上說(shuō)chrome訪問(wèn)iframe要在服務(wù)器環(huán)境下，不知道什么情況--> 
window.document.getElementById("iframepage").contentWindow.onscroll = function aaa() { 
var ifm = document.getElementById("iframepage").contentWindow.document.documentElement; 
if (ifm.scrollTop == ifm.scrollHeight - ifm.clientHeight) { 
alert("到底了"); 
} 

} 
</script> 

您可能感興趣的文章:

相關(guān)文章

layui實(shí)現(xiàn)圖片虛擬路徑上傳,預(yù)覽和刪除的例子
今天小編就為大家分享一篇layui實(shí)現(xiàn)圖片虛擬路徑上傳,預(yù)覽和刪除的例子，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2019-09-09
js獲取隨機(jī)顏色值的函數(shù)
隨機(jī)顏色如何獲取，在本文將為大家介紹下如何使用js來(lái)獲取，感興趣的朋友可以參考下
2013-09-09
D3.js實(shí)現(xiàn)雷達(dá)圖的方法詳解
大家應(yīng)該都知道基本圖表一共有六種，分別是柱狀圖、折線圖、散點(diǎn)圖、氣泡圖、餅圖和雷達(dá)圖。前面五種圖形都已經(jīng)介紹過(guò)如何實(shí)現(xiàn)了，今天我們一起來(lái)看看最后的雷達(dá)圖。有需要的朋友們可以參考學(xué)習(xí)下。
2016-09-09
JavaScript實(shí)現(xiàn)統(tǒng)計(jì)文本框Textarea字?jǐn)?shù)增強(qiáng)用戶體驗(yàn)
現(xiàn)在流行的Twitter等微博客網(wǎng)站，有一個(gè)很好的用戶體驗(yàn)，就是在文本框中輸入文字的時(shí)候，會(huì)自動(dòng)統(tǒng)計(jì)輸入的字符，并顯示用戶還能輸入的字符，在限制了140個(gè)字的微博客中，這樣的小提示可以很好的增強(qiáng)用戶體驗(yàn),本文也嘗試著實(shí)現(xiàn)一下
2012-12-12
javascript實(shí)現(xiàn)圖片輪播代碼
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)圖片輪播代碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2019-07-07
js幾個(gè)不錯(cuò)的函數(shù) $$()
js幾個(gè)不錯(cuò)的函數(shù) $$()...
2006-10-10
將HTML自動(dòng)轉(zhuǎn)為JS代碼
將HTML自動(dòng)轉(zhuǎn)為JS代碼...
2006-07-07
Webpack按需加載打包c(diǎn)hunk命名的方法
這篇文章主要給大家介紹了關(guān)于Webpack按需加載打包c(diǎn)hunk命名的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用Webpack具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2019-09-09
JS實(shí)現(xiàn)websocket長(zhǎng)輪詢實(shí)時(shí)消息提示的效果
這篇文章主要介紹了JS實(shí)現(xiàn)websocket長(zhǎng)輪詢實(shí)時(shí)消息提示的效果的相關(guān)資料,需要的朋友可以參考下
2017-10-10
常見的瀏覽器存儲(chǔ)方式（cookie、localStorage、sessionStorage）
今天我們從前端的角度了解一下瀏覽器存儲(chǔ)，我們常見且常用的存儲(chǔ)方式主要由兩種：cookie、webStorage（localStorage和sessionStorage）。本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友參考下吧
2019-05-05