5

ユーザーからのフィードバックがまったくない状態で終了するまでに少し時間がかかる JavaScript メソッドがあるとします。私の場合、テーブル要素の行を並べ替えています (すべて DOM にあり、行が多い場合にのみ時間がかかります) が、何でもできる可能性があります。実行中に「進行状況」カーソルを表示したい。ここに私が現在持っているものがありますが、他にもいくつかのことを試しました：

// SORT   
document.body.style.cursor = "progress";
MyLongRunningMethod(); //blocks for 10-15 seconds before returning
document.body.style.cursor = "auto";

残念ながら、何も起こりません。MyLongRunningMethod() は正しく動作しますが、カーソルは決して変化しません。私の考えでは、ウィンドウ環境によって生成されたカーソル変更メッセージを処理できるようにするには、メソッドが戻るのをブラウザが待つ必要があると思いますが、それはかなりずれている可能性があり、それが本当であっても修正方法がわかりません。

他のアイデアはありますか？

[編集]: 私が持っていたすべての裏話は本当に必要ではないと判断しました. 本当に読みたい場合は、改訂履歴を確認してください。

最終結果

最終的にRoBorgのソリューションを使用しました。インラインスコープブロックを追加するのと同じように、関数をすぐに宣言したままにできるため、最初に考えていたほどコードを台無しにしません。

興味深いことに、Firefox では、カーソルをまったく変更する必要がないことを発見しました。setTimeout 呼び出しを追加した後、進行状況カーソルが設定される前に待機カーソルが表示されることがあることがわかったので、カーソル コードをコメントアウトしました。setTimeout を使用してこれをクリック イベント ハンドラー自体からプッシュすることで、FireFox がカーソルを変更する必要があることを独自に判断できることがわかりました。残念ながら、IE はそれほどスマートではないので、カーソル コードを元に戻しました。

これは、ここではカーソルの変更が適切なアクションであるという私の信念に信憑性を与えます。ほとんど知らないページの DOM に新しいアイテム (ある種のビジーな画像など) を追加したり削除したりする必要は本当にありません。ページがどのようなビジュアル デザインを使用していても、スクリプトは一致する必要があります。

最後に、Chrome はすべてを無意味にします。同じデータを使用すると、IE や Firefox で 10 ～ 15 秒かかっていた作業を Chrome で 5 秒未満で実行できます。そのため、彼らの JavaScript エンジンは本当に高速です。Firefox 3.1 エンジンが待ちきれません。残念ながら、ここにいる人々はまだほとんどが IE6 を使用しています。

4

3 に答える 3

9

タイマーの使用は論外ですか？

document.body.style.cursor = "progress";

setTimeout(function()
{
    SortTable(cell.cellIndex, dir, sortType);
    document.body.style.cursor = "auto";
}, 10);
于 2009-03-12T20:23:34.647 に答える
2

Web では、マウス カーソルの変更は慣習的ではなく、適切ではありません。

ページ自体にいくつかの小さなアニメーションを使用する方がはるかに優れています (そして簡単です) 。そのような画像についてはhttp://www.ajaxload.info/を確認してください (これはオンライン ジェネレーターです)。

于 2009-03-12T20:49:32.340 に答える
0

document.body.style.cursor = "auto" を削除して、SortTable 関数の完了時に呼び出される関数に配置してみてください。そうすれば、関数が完了するまでビジー カーソルを保持できます。SortTable() 内でエラー状態に達した場合でも、「ビジーではなくなった」関数呼び出しを実行していることを確認してください。

于 2009-03-12T20:43:19.827 に答える