2011-08-07 4 views
2

JavaScriptはウェブサイト/ webapp上でできるだけ実行されないようになっていますか?これは、ページが読み込まれてすぐにすべてのjsファイルを実行し、それらをすぐに実行し、すぐに関数を実行して終了するという通常の意図を意味します。JavaScriptのget-it-doneの性質

私はGoogleマップを使用しているプロジェクトに取り組んでいます。カスタムマーカーオブジェクトがスクリプト化されており、ページに何か表示される前にブラウザがすべてのjsファイルを実行すると教えてくれました。

私の問題はここにあります:jQuery(ドック内のOS Xアイコンに似ています)と無限ループ関数のいくつかの試みがすべてブラウザをクラッシュさせて、連続的に上下に跳ね返る特定のマーカーをアニメーション化したかったのです。だから私は、ブラウザがそれを好きではないことを理解して、しかし、単純なスクリプトをバックグラウンドで繰り返して、ユーザーがページをナビゲートしている方法がありますか?それともJavascriptはそのように使うべきではないのですか?

(私の考え方がまだそこにあるので、私は長い時間のためにFlashで働いていた。)

+0

つまり、「どのようにJavascriptで繰り返しタスクをスケジュールできますか」 –

答えて

3

はい、Javascript関数はビットを実行し、できるだけ早く終了する必要があります。 GUIとスクリプトは同じ単一のスレッド上で実行されるので、JavaScript関数の中にいる限り、ブラウザには何も表示されません。無限ループを使用しようとすると、ブラウザがフリーズするように見えます。

window.setIntervalおよびwindow.setTimeoutの方法を使用して、特定の時刻に実行されるコードをトリガします。 1秒に数回更新する間隔を実行することで、アニメーションを作成できます。

+0

ありがとう教授!私はそれらを読んでみましょう。 –

2

あなたが定義された時間後にスクリプトを実行するためにタイマーを設定する必要があります。

var timer = setTimeout(code, milliseconds); 

は、so-and-soミリ秒でcodeを実行します。スクリプトを実行するたびに、新しいタイマーを設定してスクリプトを再実行することができます。

clearTimeout(timer)を使用してタイミングイベントをキャンセルできます。

+0

私は実際に 'setTimeout'に問題がありました。私のjsは' setTimeout''d行をスキップして、続行していました。そして、2000ミリ秒で何をやっていたかを決して忘れないでください。私はGoogleの地図を使用して合併症があると思う –

0

個人的には、ページがロードされた後に実行するためにできるだけ多くのコードを保存しますが、<script>をすべて<body>の下に置くことで部分的には保存します。これは、ページ読み込み時間の短縮(知覚される)を意味しますが、必要に応じてすべてのJSを実行する準備ができています。

文書の冒頭に行う必要があることはすべて実行することはお勧めしません。代わりに、ボタンのクリックなどのイベントにバインドしてください。

+0

私はそれを念頭に置いて、物事は多分私はデータベースから引っ張っているときに少し異なって動作しますが、Googleマップは 'onload ) '。 –

+0

downvoteのおかげで、誰でもそれがあった。 DownvoteのSilent Ninjasが再び襲ってきました。とにかく、Googleのスクリプトを ''の末尾に置いてください。それは少し物事を助ける必要があります。 – Bojangles

+0

彼らはあなたの戦略に同意しないのでしょうか?ありがとう私は棒でそれを突き刺す –

1

setTimeout()またはsetInterval()を使用してください。 MDCの記事はかなり良いです。

ループの内部を更新するのではなく、すばやく実行されるが、何度も呼び出される関数の内部を更新する必要があります。

+0

それはそれを置くための良い方法です、ありがとう –

1

jQueryを使用していると言われているので、そのeffects API(たとえば、jQuery.animate())を使用することをお勧めします。

+0

はい私は 'animate()'が大好きですが、私の問題は、アニメーションそのものを作成するのではなく、アニメーションのタイミングとループが問題でした。 –