基本的に、更新ボタンがあります。ユーザーが更新ボタンをクリックすると、Webサービスが呼び出され、データが返され、divコンテナーが更新されて新しいデータが表示されます。
しかし、ユーザーに更新ボタンをクリックさせずにdivコンテナーを更新したいのですが。
ページ全体を更新せずに、jQueryに2秒ごとにボタンをクリックさせるにはどうすればよいですか?またはこれを行うためのより良い方法はありますか?
基本的に、更新ボタンがあります。ユーザーが更新ボタンをクリックすると、Webサービスが呼び出され、データが返され、divコンテナーが更新されて新しいデータが表示されます。
しかし、ユーザーに更新ボタンをクリックさせずにdivコンテナーを更新したいのですが。
ページ全体を更新せずに、jQueryに2秒ごとにボタンをクリックさせるにはどうすればよいですか?またはこれを行うためのより良い方法はありますか?
setInterval を使用して、一定時間ごとに関数を呼び出すことができます。
setInterval(function(){
$("#myBtn").click();
},2000);
これにより、2 秒ごとに myBtn 要素のクリック イベントが呼び出されます。
ajax リクエストを送信している場合は、応答を受信するのに間隔よりも時間がかかる場合があることに注意してください。これにより、いくつかの問題が発生する可能性があります。そのため、代わりに再帰呼び出しを使用することを検討してください。(Ajax コールバック関数からクリック関数を呼び出します)
setInterval
2 秒ごとに関数を実行するために使用できます。
関数を繰り返し呼び出します。その関数を呼び出すたびに一定の時間遅延があります。
そして、呼び出された関数がボタンのクリック ハンドラを呼び出すようにします。理想的には、クリック ハンドラを直接呼び出す必要はありません$x.click()
。
を使用setTimeout
する方が良いアイデアかもしれません:
指定された遅延の後にコード スニペットまたは関数を実行します。
次に、コールバック関数がクリック ハンドラーを呼び出し、それが終了すると、setTimeout
再度呼び出して自分自身をトリガーします。このアプローチにより、時限イベントが互いにオーバーランするのを防ぐことができます。すべてのコードはあなたのものなので、$.ajax
成功とエラーのコールバック (またはおそらくcomplete
コールバック) がタイマーを再起動できるようにコードを再構築できます。
コマンドを使用して、クリーンな古いjavascriptでこれを行うことができますsetInterval
。次に例を示します。
//Run updates every 2 seconds
var x=setInterval(doUpdates,2000);
function doUpdates() {
//Do whatever updating you need
}
ここで自動更新を停止する場合は、コマンドを使用できますclearInterval(x);
。
データの更新に時間がかかる場合は、各リクエストの間隔が2秒になるようにすることができます。
function doUpdates() {
//Do whatever updating you need
$.ajax({
'success':function() {
setTimeout(doUpdates,2000);
}
});
}
2番目の例では、更新が完了した直後にsetTimeoutを配置します。