jquery - Jqueryを使用して1つのhtmlファイルをロードし、遅延してから別のHTMLファイルをループします

Question

1つのhtmlファイルを表示したいと思います。次に、別のものにフェードします。これが私のコードです。最初の場合を除いて、10秒待ってから切り替えます。次に、切り替え後、切り替えの合間に5秒間待機します。jqueryがタイムアウトと待機を処理する方法について少し混乱しています。最初のスイッチから始めて、スイッチごとに5秒待ちたいです。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
        $("#responsecontainer3").load("ad1.html");
  var refreshId = setInterval(function() {
     $("#responsecontainer3").fadeTo("slow").load('ad1.html?randval='+ Math.random());

setTimeout(function() 
  { 
     $("#responsecontainer3").fadeTo("slow").load('ad2.html?randval='+ Math.random());
  }, 5000); 

 }, 10000);


});
</script>
<div id="responsecontainer3">
</div>

Answer 1

function loadFile(url) {
   $("#responsecontainer3").load(url, function() {
       var index = parseInt( url.replace('ad','').replace('.html','') );
       $("#responsecontainer3").fadeTo('slow', function() {
         setTimeout(function() {
             index++;
             loadFile('ad'+index+'.html');
         }, 5000)
       });
   });
}

loadFile('ad1.html');

Answer 2

<script>
 $(document).ready(function() {
        $("#responsecontainer3").load("ad2.html");

   var index = 1;
   var refreshId = setInterval(function() {
      $("#responsecontainer3").load('ad'+index+'.html');
      index = (index == 2)? 1 : index+1;
   }, 5000);
   $.ajaxSetup({ cache: false });
});
</script>