0

一連の計算を実行し、イベントcompute()によってトリガーされてHTMLテーブルの値を更新するという関数があります。click()これはajax呼び出しではなく、いくつかのforループです。

私がやりたいのは、計算が実行されていることを視覚的に示すことです。テーブルの不透明度を変更するようなものです。私は次のようなものがうまくいくと思いました：

$("#mytable").css("opacity", "0.5");
compute();
$("#mytable").css("opacity", "1");

しかし、このコードを使用すると、不透明度が変更されていないようです。

これを行う方法についてのヒントはありますか？

よろしくお願いします！

4

3 に答える 3

2

これは、不透明度の変更とcompute();関数の間で UI が更新されないためです。UI は、コードのすべての行の後ではなく、しばらくの間更新されます (すべてが遅くなります)。

タイムアウトを使用してそれをバイパスできます: setTimeout(compute, 0);.

そうすれば、実行する前に UI が更新されますcompute()。不透明度を1に戻す3行目をその関数に入れる必要があります。これは、実行される前に実行されるためcompute()です。

$("#mytable").css("opacity", "0.5");
setTimeout(compute, 0);

function compute() {
    ...

    $("#mytable").css("opacity", "1");
}

最初は汚れているように見えるかもしれませんが、UI が更新されていることを確認するための本物の方法です!

于 2012-11-23T14:58:09.197 に答える
0

computeJavaScript のすべてのクライアント側実装はシングル スレッドであるため、次のステートメントが実行されている間、関数呼び出しが実行され続けることは実際には期待できません。ただし、必要に応じてWeb workerを使用して、バックグラウンド スレッドを生成する
こともできます。

あなたの質問をもう一度読んだ後、@tomdemuyt は非常に正しいと言わざるを得ません。非常にcompute高速に実行されるため、不透明度が 1 秒間に 2 回変更される可能性が非常に高く、変化にほとんど気付かないほど高速です。また、これはイベント ハンドラーであるため、次のことを考慮する必要があります。

function compute(e)
{
    $(this).css({opacity:'.5'});
    //rest of your code
    $(this).css({opacity:'1'});
}
$('#mytable').on('click',compute);

これはもう少し整頓されたIMOです-これはあなたのコードには当てはまらないかもしれませんが、念のため...

于 2012-11-23T14:57:46.563 に答える
0

これは、compute() 関数が非常に高速に実行されるため、不透明度の変化に気付かないことが原因である可能性があります。

compute() にブレークポイントを配置してみてください。不透明度が変化したかどうかをお知らせください。

于 2012-11-23T14:57:46.263 に答える