在onload事件前獲取圖片的寬高
阿新 • • 發佈：2018-07-04
get 創建對象 UNC 後臺 set 避免 trap 記錄 val
有時候在獲取從後臺的圖片時，要對圖片進行一系列的處理，才渲染出來
我們要解決的是沒有緩存而又快速的相比onload更快的方式去獲取圖片的寬高，接下來上代碼
通過定時循環檢測獲取：
// 記錄當前時間戳 var start_time = new Date().getTime() // 圖片地址 後面加時間戳是為了避免緩存 var cutSrc = window.ctx + ‘/touchsys/terminal/showCapture?terminalId=‘ + terminalId + ‘×trap=‘ + Math.random(); // 創建對象 var img = new Image() // 改變圖片的src img.src = cutSrc; // 定時執行獲取寬高 var check = function(){ // 只要任何一方大於0 // 表示已經服務器已經返回寬高 if (img.width>0 || img.height>0) { var diff = new Date().getTime() - start_time; document.body.innerHTML += ‘ from:check : width:‘+img.width+‘,height:‘+img.height+‘, time:‘+diff+‘ms‘; clearInterval(set); } } var set = setInterval(check,40) // 加載完成獲取寬高 img.onload = function(){ var diff = new Date().getTime() - start_time; document.body.innerHTML += ‘from:onload : width:‘+img.width+‘,height:‘+img.height+‘, time:‘+diff+‘ms‘; //在裏面在做一些我們想處理的邏輯 };
在onload事件前獲取圖片的寬高