setInterval関数他のsetInterval関数とのスレッド遅延はJqueryです

javascript魔女の2つの時間間隔変数は1秒で実行され、5秒です。私はmyTimer1()で寝る。その状態では、現在の時刻機能myTimer()は、ブラウザ上に表示するための遅延を示しています。実際には2番目のジャンプです。私はリアルタイムで表示する連続秒をしたい。リアルタイムで表示する方法が他にもある場合は、大変感謝しています。 MVCベースのWebアプリケーションでこのような状況に直面しています。setInterval関数他のsetInterval関数とのスレッド遅延はJqueryです

<!DOCTYPE html> 
<html> 
<body> 

<p>A script on this page starts this clock:</p> 
<p id="demo"></p> 
<p id="demo1"></p> 
<script> 
var myVar = setInterval(function(){ myTimer() }, 1000); 

function myTimer() { 
    var d = new Date(); 
    var t = d.toLocaleTimeString(); 
    document.getElementById("demo").innerHTML = t; 
} 

var myVar1 = setInterval(function(){ myTimer1() }, 5000); 

function myTimer1() { 
document.getElementById("demo1").innerHTML = "Prashant"; 
//Calling some function from server side witch taking some time to calculated data to showing on browser and it will take some time to load like 2-3 sec. so I use sleep for example. 
sleep(3000); 
} 

function sleep(milliseconds) { 
    var start = new Date().getTime(); 
    for (var i = 0; i < 1e7; i++) { 
    if ((new Date().getTime() - start) > milliseconds){ 
     break; 
    } 
    } 
} 

</script> 

</body> 
</html>

出典

2016-04-19 Prashant Mehta

JavaScriptコードでwaitループを使用しないでください。あなたはブラウザを凍らせてしまうので、決して戻ってこないかもしれません（確かに100％のCPUを何の理由もなく使いません:)。 –

私はコメント付きの質問を編集しました。 –

sleep()コールを完全に削除すると考えましたか？（それはあなたのUIスレッドを結びつけるとして）このような呼び出しは、多くの場合、非常にパフォーマンスの低下や予期しない結果を引き起こす可能性があります：

function myTimer1() { 
    document.getElementById("demo1").innerHTML = "Prashant"; 
    // This is going to clog up your UI thread and prevent anything from occurring 
    // sleep(3000); 
}

は、それを削除してください、あなたはあなたのタイマーが継続的に実行されることがわかります。まだいくつかのタイプの遅延を引き起こす必要がある場合は、それを処理するためにsetTimeout()関数を使用して（現在のタイマーを停止して）ください。

例データベースコメント

データベースからユーザーを引いている場合、あなたはおそらくAJAXは、ハンドル時に呼び出してみましょう必要がありますについてsleep()

<!DOCTYPE html> 
 
<html> 
 
<body> 
 

 
<p>A script on this page starts this clock:</p> 
 
<p id="demo"></p> 
 
<p id="demo1"></p> 
 
<script> 
 
var myVar = setInterval(function(){ myTimer() }, 1000); 
 

 
function myTimer() { 
 
    var d = new Date(); 
 
    var t = d.toLocaleTimeString(); 
 
    document.getElementById("demo").innerHTML = t; 
 
} 
 

 
var myVar1 = setInterval(function(){ myTimer1() }, 5000); 
 

 
function myTimer1() { 
 
document.getElementById("demo1").innerHTML = "Prashant"; 
 

 
} 
 

 
function sleep(milliseconds) { 
 
    var start = new Date().getTime(); 
 
    for (var i = 0; i < 1e7; i++) { 
 
    if ((new Date().getTime() - start) > milliseconds){ 
 
     break; 
 
    } 
 
    } 
 
} 
 

 
</script> 
 

 
</body> 
 
</html>

なし彼らは終わった。あなたは5秒ごとに新しいユーザーを引くしたい場合は、このようappraochの使用を検討できます。

// Keep track of how many users you have pulled var usersPulled = 0; // Every 5 seconds, pull a user var userTimer = setTimeout(function(){ pullUser(); }, 5000); function pullUser(){ // Make an AJAX call to pull your specific user $.get('/Users/Get', { skip: usersPulled++ }, function(user){ if(user) { // Get the user that was pulled and output them $('#userlist').append('<p>' + user + '</p>'); } else { // No user was found, stop your timer clearTimeout(userTimer); } }); }

そして、サーバー側のコードは、あなたの中で「次」のユーザーを引っ張って、次のようになりますデータベース：イベントキュー（ジョブキュー）システム上で動作するブラウザでのJavaScriptのスレッド、唯一メインUIはあり

public string Get(int skip) { // Get the first user available var user = _context.Users.OrderBy(u => u.Name).Skip(skip).FirstOrDefault(); if(user != null) { return user.Name; } return null; }

出典

2016-04-19 13:41:43

を参照してください。基本的に私は単にスリープを入れます。 SQL接続からデータが来ていて、時間がかかります。 –

おそらくAJAX呼び出しを介してJavascriptを介してデータを取得する場合は、それが完了したときに処理するだけです。すべての一般的なAJAXコールは、コールバック関数を備えています。コールバック関数は、コールバック関数が完了したことを知らせるので、これらのコールバックの1つにデータを簡単に入れることができます。 –

@PrashantMehta：それはあなたの質問にとって重要な情報でした。クエリとは何ですか？それはどの技術を使用していますか？それが戸惑う電話であれば驚くべきことです。 –

。 setTimeoutまたはsetIntervalでタイマーをスケジューリングすると、コールバックを呼び出す時間に達すると、実際にはメインUIスレッドが処理できるようにジョブ（イベント）がキューに入れられます。

あなたのsleep機能は、メインのUIスレッドを結びつけているので、あなたのループのwhileに座って何もできません。これには、タイマーからのコールバックを処理できないことも含まれます。

sleepを削除してください。それは何も役に立たない。それは何かを行うun便利なはです。

何らかの理由で、あなたは3秒timer1への呼び出しの後に何かをしたかった、場合、あなたはsetTimeoutでそれを行うだろう：

あなたが言ったコメントで

function myTimer1() { 
    document.getElementById("demo1").innerHTML = "Prashant"; 
    setTimeout(function() { 
     // Do the thing you wanted to do 3 seconds later 
    }, 3000); 
}

：

基本的には、たとえばスリープを入れるだけです。 SQL接続からデータが来ていて、時間がかかります。

私たちが見ることのできないコードを手伝っても大変です。

通常、あなたはajaxを介してそのデータをクエリしているので、非同期（上記のように私はsetTimeoutのように）で、同期しない限り、ブラウザをロックしません。（ヒント：do not doコールバックを使用してください）。

出典

2016-04-19 13:42:01

応答のためのクラウダーをありがとう。 //サーバーサイドの魔法使いから関数を呼び出して、計算されたデータをブラウザーに表示するまでに時間をかけ、2-3秒のように読み込むには時間がかかるでしょう。だから私は睡眠を例にとる。 –

setInterval関数他のsetInterval関数とのスレッド遅延はJqueryです

答えて

関連する問題