亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何通過JavaScript加載圖像時顯示微調框

如何通過JavaScript加載圖像時顯示微調框

我目前正在使用一個Web應用程序,該應用程序的頁面顯示一個圖表(.png圖像)。在此頁面的另一部分上,有一組鏈接,單擊這些鏈接可以重新加載整個頁面,除了頁面中間的圖表外,其他外觀與以前完全相同。我想做的是單擊頁面上的鏈接后,只需更改頁面上的圖表即可。由于頁面大約100kb大,這將極大地加快處理速度,并且真的不想為了顯示此頁面而重新加載整個頁面。我一直在通過JavaScript進行此操作,到目前為止,該JavaScript可以使用以下代碼運行document.getElementById('chart').src = '/charts/10.png';問題在于,當用戶單擊鏈接時,圖表更改可能需要幾秒鐘的時間。這使用戶認為他們的點擊沒有做任何事情,或者系統響應緩慢。我想發生的是顯示一個微調器/抖動器/狀態指示器,以代替圖像加載時的位置,因此,當用戶單擊鏈接時,他們至少知道系統已經接受了輸入并正在對其進行操作。我嘗試了一些建議,甚至使用psudo超時來顯示微調框,然后再飛回圖像。我收到的一個很好的建議是使用以下內容<img src="/charts/10.png" lowsrc="/spinner.gif"/>除了微調器明顯小于顯示的圖表之外,這將是理想的選擇。還有其他想法嗎?
查看完整描述

3 回答

?
蝴蝶刀刀

TA貢獻1801條經驗 獲得超8個贊

我已經使用過類似的方法來預加載圖像,然后在圖像加載完成后自動調用我的JavaScript。您想在設置回調之前檢查完成情況,因為該圖像可能已被緩存,并且可能不會調用您的回調。


function PreloadImage(imgSrc, callback){

  var objImagePreloader = new Image();


  objImagePreloader.src = imgSrc;

  if(objImagePreloader.complete){

    callback();

    objImagePreloader.onload=function(){};

  }

  else{

    objImagePreloader.onload = function() {

      callback();

      //    clear onLoad, IE behaves irratically with animated gifs otherwise

      objImagePreloader.onload=function(){};

    }

  }

}


查看完整回答
反對 回復 2019-11-26
  • 3 回答
  • 0 關注
  • 605 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號