遅いphpコード実行時に、処理中である旨をページ内に表示したい


大変お世話になっております。どうかご教授頂けませんでしょうか。

以下の様なphpのページ（site_a.php）がございます。このページは他のページから遷移され、そしてphpの処理をして約5秒後に他のページに自動で遷移していきます。

その約五秒の間、白の画面が表示されるのですが、javascriptのローディングの機能を自動発火する様に実装したいと考え、その下にある記述を追加いたしました。

しかしながら、機能しておりません。以前と同様に白の画面が表示され、約5秒後に次のページに遷移していきます。loadingのjavascript、あるいはそのための自動発火が機能していない様です。

このphpページでjavascriptのローディングがどうすれば機能するかお教え願いませんでしょうか？

尚、同様のローディングの機能はhtmlのページでは手動クリックの後に機能しております。

* * *

  * site_a.php

[code]

    <?php
    
    // phpのコーディング
    
    ?>
    
    <form action='xxxxxx.php' METHOD='POST'>
    <input type="submit" id="submit" value="" style="display:none;"/>   
    </form>
    
    <script>
    document.getElementById("submit").click();
    </script>   
    
[/code]

  * 上記の記述（site_a.php）にjavascriptのローディングの機能を自動発火する様な設定で追加。

[code]

    <html>
    <head>
    <body id="loading">
    </body>
    </head> 
    </html>
    
    <script> 
    
    $(function () {
      $("#loading").click( function() {
    
        // 処理前に Loading 画像を表示
        dispLoading("処理中...");
    
      });
    });
    
    
        function dispLoading(msg){
          // 引数なし（メッセージなし）を許容
          if( msg == undefined ){
            msg = "";
          }
          // 画面表示メッセージ
          var dispMsg = "<div class='loadingMsg' style='color:blue; padding:10px; 
        text-align:center'>" + msg + "</div>";
          // ローディング画像が表示されていない場合のみ出力
          if($("#loading").length == 0){
            $("body").append("<div id='loading' style='color:blue; padding:10px; 
        text-align:center'>" + dispMsg + "</div>");
          }
        }
    
    
    
            /* ------------------------------
             Loading イメージ削除関数
             ------------------------------ */
            function removeLoading(){
              $("#loading").remove();
            }
    
    
                }
    
        </script>
    
    <script>
    document.getElementById("loading").click();
    </script>
    
    <?php
    
    // phpのコーディング
    
    ?>
    
    <form action='xxxxxx.php' METHOD='POST'>
    <input type="submit" id="submit" value="" style="display:none;"/>   
    </form>
    
    <script>
    document.getElementById("submit").click();
    </script>   
    
[/code]

  * css

[code]

    #loading {
      display: table;
      width: 100%;
      height: 100%;
      position: fixed;
      top: 0;
      left: 0;
      background-color: #fff;
      opacity: 0.8;
    }
    
    #loading .loadingMsg {
      display: table-cell;
      text-align: center;
      vertical-align: middle;
      padding-top: 140px;
      background: url("[LoadingイメージのURL]") center center no-repeat;
    }
    
[/code]




ajaxでサーバに処理を依頼し処理結果を待ってからページ遷移すれば良いと思うのですが。

通常は、phpの処理が完了しないと画面が表示されません。（処理が完了するまで **HTML**
が出力されません）先にhtmlなどのデータを出力為には、phpで[出力バッファリング制御](https://www.php.net/manual/ja/book.outcontrol.php)を行います。  
以下にサンプルコードを

[code]

            <?php
            //header()などの初期処理を行う。
            ?>
        <!DOCTYPE html>
            <html>
            <head>
                <meta charset="UTF-8">
                <title>こんにちは！</title>
            </head>
            <body>
            こんにちは！しばらくお待ちください。
            </body>
            <?php
    $gonext = <<<eot
    <script type="text/javascript"> window.location.href='https://ja.stackoverflow.com/';
    </script>
    eot;
            echo str_pad(" ",4096);//ブラウザでバッファーリングされて直ぐに表示されない時は空白などを出力する。
            ob_end_flush();
            ob_start('mb_output_handler');
            ob_flush();
            flush();
            //サーバでそれなりの処理を行う。
    
            sleep( 5 ); // 時間がかかる処理１
            echo $gonext;
            ob_flush();
            flush();
            ?>
        </html>
    
[/code]

追記、phpから、htmlの任意の場所でjavascriptを実行させるには、javascriptを実行させたい場所にscriptタグで囲み出力することで、javascriptを実行させる事が出来ます。  
サンプルコードを 時間のかかる処理（sleepを入れています。）後、ページ遷移するように修正してみました。




ajaxでサーバに処理を依頼し処理結果を待ってからページ遷移すれば良いと思うのですが。

通常は、phpの処理が完了しないと画面が表示されません。（処理が完了するまで **HTML**
が出力されません）先にhtmlなどのデータを出力為には、phpで[出力バッファリング制御](https://www.php.net/manual/ja/book.outcontrol.php)を行います。  
以下にサンプルコードを

[code]

            <?php
            //header()などの初期処理を行う。
            ?>
        <!DOCTYPE html>
            <html>
            <head>
                <meta charset="UTF-8">
                <title>こんにちは！</title>
            </head>
            <body>
            こんにちは！しばらくお待ちください。
            </body>
            <?php
    $gonext = <<<eot
    <script type="text/javascript"> window.location.href='https://ja.stackoverflow.com/';
    </script>
    eot;
            echo str_pad(" ",4096);//ブラウザでバッファーリングされて直ぐに表示されない時は空白などを出力する。
            ob_end_flush();
            ob_start('mb_output_handler');
            ob_flush();
            flush();
            //サーバでそれなりの処理を行う。
    
            sleep( 5 ); // 時間がかかる処理１
            echo $gonext;
            ob_flush();
            flush();
            ?>
        </html>
    
[/code]

追記、phpから、htmlの任意の場所でjavascriptを実行させるには、javascriptを実行させたい場所にscriptタグで囲み出力することで、javascriptを実行させる事が出来ます。  
サンプルコードを 時間のかかる処理（sleepを入れています。）後、ページ遷移するように修正してみました。

