2017-04-25 9 views
0

ページロード時にFIRST時間のテーブルをリフレッシュするAJAX呼び出しを開始したいが、それ以降はXX秒ごとに実行する必要があるユーザが「リフレッシュ」ボタンを押すたびにも表示されます。JS/jQuery - ページ読み込み時に関数を起動し、x秒おきにANDをクリックすると

今、私は同じコードを3つコピーして3つの異なるランチャーにバインドしたくないのですが、これには最善の方法はありますか?ここ

これは、5秒ごとに実行されますが、ページの読み込みやボタンに応じ

<script type="text/javascript" language="javascript"> 
    $(function() { 
     var prevAjaxReturned = true; 
     var xhr = null; 

     setInterval(function() { 
      if(prevAjaxReturned) { 
       prevAjaxReturned = false; 
      } else if(xhr) { 
       xhr.abort(); 
      } 

      xhr = $.ajax({ 
       type: 'POST', 
       url: '../../plugins/MySQL/ajax_action.php', 
       data: { 
        action: 'refresh_rescap_reqs', 
        holidex: '<?php echo($_SESSION['Holidex']); ?>', 
        access: '<?php echo $_SESSION['Access']; ?>' 
       }, 
       //dataType: 'json', 
       success: function(data) { 
        $('#Last20Requests').html(data); 
        prevAjaxReturned = true; 
       }, 
      }); 

     }, 5000); // 1000ms = 1 sec 
    }); 
    </script> 

おかげ

+0

この関数を呼び出す関数内のAJAX呼び出しをラップし、この機能を3回呼び出しますか? – Epitouille

+0

1つの関数を使用する際の問題は3つの異なる場所でバインドするのですか? –

答えて

1

ラップ機能でAJAX呼び出しと3回

$(function() { 
 
    var prevAjaxReturned = true; 
 
    var xhr = null; 
 

 
    var repeatFunction = function() { 
 
     if(prevAjaxReturned) { 
 
      prevAjaxReturned = false; 
 
     } else if(xhr) { 
 
      xhr.abort(); 
 
     } 
 

 
     xhr = $.ajax({ 
 
      type: 'POST', 
 
      url: '../../plugins/MySQL/ajax_action.php', 
 
      data: { 
 
       action: 'refresh_rescap_reqs', 
 
       holidex: '<?php echo($_SESSION['Holidex']); ?>', 
 
       access: '<?php echo $_SESSION['Access']; ?>' 
 
      }, 
 
      //dataType: 'json', 
 
      success: function(data) { 
 
       $('#Last20Requests').html(data); 
 
       prevAjaxReturned = true; 
 
      }, 
 
     }); 
 

 
    }; 
 
    repeatFunction(); 
 
    setInterval(repeatFunction, 5000); // 1000ms = 1 sec 
 
    $("#reload").on('click', repeatFunction); 
 
});
<a href="javascript:void(0)" id="reload">Reload</a>

+0

関数/ ajax呼び出しの代わりにWebサイト全体をリロードするので、ボタンに問題があるようです...?私は '

+0

ああ...ええ...ボタンの上にアンカータグを使用することができます –

+0

hmmm ...ボタンはまだ動作しません。 'type =" button "'を使用すると、コンソールは関数参照が存在しないというエラーを返します。 'type'属性では、ページ全体がリロードされます...? – Armitage2k

3

がちょうど変数にあなたの機能を結合して、あなたはそれを再利用することができますクリックしません。

<script type="text/javascript" language="javascript"> 
$(function() { 
    var prevAjaxReturned = true; 
    var xhr = null; 

    var functionToRun = function() { 
     if(prevAjaxReturned) { 
      prevAjaxReturned = false; 
     } else if(xhr) { 
      xhr.abort(); 
     } 

     xhr = $.ajax({ 
      type: 'POST', 
      url: '../../plugins/MySQL/ajax_action.php', 
      data: { 
       action: 'refresh_rescap_reqs', 
       holidex: '<?php echo($_SESSION['Holidex']); ?>', 
       access: '<?php echo $_SESSION['Access']; ?>' 
      }, 
      //dataType: 'json', 
      success: function(data) { 
       $('#Last20Requests').html(data); 
       prevAjaxReturned = true; 
      }, 
     }); 

    }; 

    setInterval(functionToRun, 5000); // 1000ms = 1 sec 
    $(document).on('click', functionToRun); 
    functionToRun(); 
}); 

関連する問題