今天發現chrome下的一個小問題,當img.src重復設置為相同值的時候,img.onload不會重復執行。
<img src=""><button>click me</button> <script> var img = document.getElementsByTagName('img')[0]; var button = document.getElementsByTagName('button')[0]; var count = 0; button.onclick = function(){ img.onload = function(){ alert('you load:'+(++count)); }; img.src = 'chrome.jpg'; } </script>
為了讓img.onload每次都能運行,只能讓img.src每次都改變。
方法一——加時間戳:
img.src = 'chrome.jpg?r='+(new Date());
但這種方法讓瀏覽器無法緩存圖片,因此可以使用方法二:
img.onload = null;//先解除onload事件 img.src = '';//讓img.src改變 img.onload = function(){//再綁定onload事件 //your code here }; img.src = 'chrome.jpg';