ボタンでアニメーションGIFをリフレッシュする

Question

私は今この問題に悩まされています。ボタンを押すたびにgifイメージを "リフレッシュ"する方法を理解するために助けが必要です。私はこれについて数多くのオンラインアイデアを試しましたが、どれも動作していないようです。私はブラウザの履歴をクリアしたらgifを再生するだけなので、キャッシュの問題があるかもしれないと思います。誰かが私が間違っている場所にスポットを置くことができますか、これを修正する方法についてのヒントがありますか？

私のhtml：

<div class="logo"> 
     <button class="chains" id="chains" onclick="chains();"></button> 
      <div id="png"> 
       <img src="images/logo.png" alt=""/> 
      </div> 
      <div id="gif"> 
       <img src="images/chains.gif" alt="" /> 
      </div> 
    </div> 

私のJavascript機能：

<script language="JavaScript"> 
    $(document).ready(function() { 
     var myDiv = document.getElementById('gif'); 
     myDiv.style.visibility = "hidden"; 
    }); 

    function chains() { 
      d = new Date(); 
      $("#gif").attr("src", "images/chains.gif?"+d.getTime()); 
      var logo = document.getElementById("png"); 
      var gif = document.getElementById("gif"); 

      var hide = function(){ 
       logo.style.visibility = "hidden"; 
       gif.style.visibility = "visible"; 
       setTimeout(show, 2300); // 5 seconds 
      } 

      var show = function(){ 
       gif.style.visibility = "hidden"; 
       logo.style.visibility = "visible"; 
      } 

      hide(); 
    }; 
</script> 

Answer 1

私は答えhere!

引用私にしてみましょう見つけ願っています：ナットシェルで

をイメージをjavascriptの変数は、[OK]をクリックします

$(function(){ 
    var image = new Image(); 
    image.src='http://rack.3.mshcdn.com/media/ZgkyMDEyLzEwLzE5LzExXzMzXzMzXzE3Nl9maWxlCnAJdGh1bWIJMTIwMHg5NjAwPg/462b8072'; 
    $('#img').click(function(){ 
    $(this).attr('src',image.src); 
    }); 
}); 

にSRCを変更EDITED：https://jsfiddle.net/op3t82ea/2/

は、いくつかの変更と機能強化とコードで追加されたコメントを作りましたよ！これが役に立ちますようお願いいたします:)