javascript - ページが完全にロードされた後に関数を開始してローダーを停止する方法

okwaves2024-01-25  11

この質問にはすでに答えがあります: ページの読み込みが完了したかどうかを検出する

(10 個の回答)

3 年前

に閉店しました。

誰かがこのコードセットを手伝ってくれませんか

ページの読み込みが完了したときにコードを開始するようにevent.listenerを設定するにはどうすればよいですか。 現時点では setTimeOut を使用していますが、接続が遅い場合は時間がかかりますローダーが消えるのは早すぎるので、インターバル時間を増やさずに、ページとそのコンテンツの読み込みが完了したときにのみコードを開始するようにしたいと考えています。 よろしくお願いいたします。 以下の私のコードを参照してください。

$('body').append('<div id="loadingDiv"><div class="loader"><img src="./images/loader/image.gif" alt="loadingImage"></div></div>');

  let clearLoader = () => {
    $("#loadingDiv").fadeOut(500, function () {
      $("#loadingDiv").remove();
    });
  }
  
  setTimeout(clearLoader, 2000);

ロード イベントをリッスンします。

– レイ

2020 年 9 月 3 日 16:25



------------------------

ウィンドウオブジェクト l に対して onload イベントを使用できます。以下のバニラの JavaScript スニペットのようなものです:

window.onload = function (){
  console.log('Window finished loading.');
}
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>After loading window</title>
</head>
<body>
  
</body>
</html>

または

jQuery の方法:

$(window).load(function(){
  console.log('Window finished loading.');
});
共有 この回答を改善します フォローする

2020 年 9 月 3 日 16:42 に回答

ユーザー10636406

ユーザー10636406

2

そのコードを試してみましたが、ページの読み込みが完了した後ではなく、指定した時間が経過するとローダーがフェードアウトします。

– ゲイリー・タランティーノ

2020 年 9 月 3 日 17:18

わかりました。@Viscocent によるこの回答をチェックしてみてください。 stackoverflow.com/a/23907579/10636406

– 

user10636406

2020 年 9 月 3 日 17:36

総合生活情報サイト - OKWAVES
総合生活情報サイト - OKWAVES
生活総合情報サイトokwaves(オールアバウト)。その道のプロ(専門家)が、日常生活をより豊かに快適にするノウハウから業界の最新動向、読み物コラムまで、多彩なコンテンツを発信。