6

Internet Explorer で問題が発生しました。Firefox では正常に動作します。

AJAX 関数の前に呼び出される UI (画面コンテンツ) を更新する Java スクリプト関数があります。ただし、アラート ボックス プロンプトが使用されるまで UI は更新されません。アラート ボックスがないと、AJAX 関数の前に UI が更新されません。AJAX関数の前に呼び出されても、AJAX関数の後にUIを更新します

次のコードを使用すると、UpdateUI() は AJAX 関数呼び出しの前に UI をまったく更新せず、AJAX 関数呼び出しの後に UI を更新します。AJAX関数呼び出しの前にUIを更新したい（実際には、AJAX呼び出しの前に読み込みバーを表示しています）

UpdateUI(); // java script function, it just updates inner HTML of a DIV

// AJAX function call here with Async = false

しかし、次のコードを使用すると、UpdateUI() は AJAX 関数呼び出しの前に UI を更新しますが、このメソッドにはアラート プロンプトが含​​まれます。アラートを使いたくない

UpdateUI(); // java script function, it just updates inner HTML of a DIV

alert('hellow');

// AJAX function call here with Async = false

Firefox では正常に動作しますが、Internet Explorer 8 では動作しません

4

1 に答える 1

12

ブラウザは通常、アクティブな JS スレッドがある場合、UI をリフロー (更新) しません。リフローを実行する前に、ts イベント キューからすべてのイベントをフラッシュするまで待機します。これは、ブラウザがすべてのイベントを実行する必要がある単一のスレッド ループのようなものと考えてください。

通常、特定の状況ではリフローの優先度が最も低くなりますが、getComputedStyle や offsetX/y などの DOM 要素の特定の属性をリクエストすることで、ブラウザを強制的にリフローさせることができます。基本的に、ブラウザが UI をレイアウトして応答する必要があるリクエストは、リフローを実行します。 .

これは、私が同様の問題に直面していたときに見つけた最高の記事です。

私が提案できる最も簡単で間違いのないトリックは、コードを 2 つのメソッドに分割し、0 ミリ秒後のタイムアウトで事前リフローを必要とするメソッドを呼び出すことです。これにより、ブラウザはメソッド 2 を呼び出す前にリフローを実行するための息抜きができます。これは、あなたが試して動作することがわかった alert() トリックとまったく同じように機能します。

于 2012-08-31T12:13:06.307 に答える