做web的同學們常常會碰到客戶上傳圖片將網頁內容區撐破了的情況,以下就這個問題我們一種如何使用js處理這個問題的方法,具體思路就是在js判斷客戶端的圖片下載完畢之後適時的對該圖片的寬度或高度做一些處理,js處理圖片主要是利用js中Image對象,透過onload 事件和onreadystatechange 來進行判斷。 (1)第一中方法,透過onload事件,例如: 複製程式碼 程式碼如下: <BR>var obj=new Image();<BR>obj.src="http://www.phpernote.com/uploadfiles/editor/201107240502201179. jpg";<BR>obj.onload=function(){<BR>alert('圖片的寬度為:' obj.width ';圖片的高度為:' obj.height);<BR>document.getElementById(" mypic").innnerHTML="<img src='" this.src "' / alt="關於JS判斷圖片是否載入完成且取得圖片寬度的方法_javascript技巧" >";<BR>}<BR>onloading… (2)第二種方法,使用 onreadystatechange 來判斷 複製代碼 代碼如下: <BR>var obj=new Image();<BR>obj.src="http://www.phpernote.com/uploadfiles/editor/201107240502201179.jpg";<BR>obj.onreadystatechange=function(){<BR> if(this.readyState=="complete"){<BR>alert('圖片的寬度為:' obj.width ';圖片的高度為:' obj.height);<BR>document.getElementById("mypic" ).innnerHTML="<img src='" this.src "' / alt="關於JS判斷圖片是否載入完成且取得圖片寬度的方法_javascript技巧" >";<BR>}<BR>}<BR>onloading…