作者b12031106 (B先生)
看板Ajax
標題Re: [問題]Javascript 沒有每次都執行
時間Thu Aug 9 18:14:54 2012
※ 引述《piglon (TEST123)》之銘言：
: 想請教
: 我寫了一個檢查破圖的js
: 但是不是每次都會把所有的破圖取代
: 有時候全部都沒有取代
: 但是重新整理幾次之後就又好了
: 流程是這樣
: 抓到某個div區塊內所有的圖片
: 檢查如果是破圖就取代成另一張圖
: 程式碼如下
: <script type="text/javascript">
: var imgs = document.getElementById("show").getElementsByTagName("img");
: for(var i = 0;i < imgs.length;i++){
: imgs[i].onerror = function(){
: this.src = "./images/broken_pic.jpg";
: }
: }
: </script>
: 我放在</body>之前
: 剛剛聽了musie的意見我改了一下但是不會取代@@
: <script type="text/javascript">
: var imgs = document.getElementById("show").getElementsByTagName("img");
: for(var i = 0;i < imgs.length;i++){
: if(imgs[i].complete){
: imgs[i].onerror = function(){this.src = "./images/pez_broken_pic.jpg";}
: }
: }
: </script>
: 我嘗試了imgs[i].onload = function(){this.src = "./images/pez_broken_pic.jpg";}
: 還是有部分不會被取代
: imgs[i].complete = function(){this.src = "./images/pez_broken_pic.jpg";}
: 則是全部沒有取代
一張圖片在載入的時候，成功會觸發onload，失敗會觸發onerror，
但無論是成功或失敗，complete都會是true，
complete只代表這張圖片嘗試過載入了沒，
而且在你的code開始跑之前，前面的img說不定都load完了，
也就表示某些img已經觸發過onerror事件，舉例來說，
你希望小明"火車到台北站的時候下車"，
但是你是在火車都已經過台中了才告訴他，
小明當然不會下車。
<script>
window.onload = function(){
var imgs = document.getElementsByTagName('img');
for (var i = 0; i < imgs.length; i++) {
if (imgs[i].naturalWidth == 0 &&
typeof(imgs[i].naturalWidth) != 'undefined') {
imgs[i].src = "./images/pez_broken_pic.jpg";
}
//for IE
if (imgs[i].readyState == 'uninitialized') {
imgs[i].src = "./images/pez_broken_pic.jpg";
}
}
};
</script>
目前只測試過chrome跟IE9，應該還有別的方法，像是用jQuery，
網路上應該都找的到，因為這個也是我google來的。
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 114.32.33.39
※ 編輯: b12031106 來自: 114.32.33.39 (08/09 18:15)
※ 編輯: b12031106 來自: 114.32.33.39 (08/09 18:16)
※ 編輯: b12031106 來自: 114.32.33.39 (08/09 18:16)
1F：推 piglon:哇!!感謝 已經成功了 但是因為檔案很大所以 我改成html 08/11 23:11
2F：→ piglon:因為圖檔load很久 還是會有不執行的狀況 08/11 23:12