簡體   English   中英

HTML暫時暫停加載以處理PHP,結果很丑

[英]HTML momentarily pauses loading to process PHP, the result is ugly

由於這是一個非常簡單的場景,因此不確定是否真的需要該示例的特定代碼。 我有一個php文件:

<html>

    <?php

     *Some code hat pulls data from a database. This involves queries, for loops, etc.

    ?>

</html>

該問題僅在Google Chrome上發生:頁面開始加載,處理PHP,然后關閉標簽。 這會導致難看的向下滑動式效果,其中下一頁看起來像是在上一頁加載的樣子。

在此處輸入圖片說明

這就是Chrome在片刻中的樣子,而且我知道我正在以一種非常非常規的方式來做某事。 我真的還不了解php的約定,但是我學得很快。

我應該做些什么? 我寧願不要在php代碼之前關閉標簽,因為那樣的話,事情將不合時宜,而php之后的所有內容當然都不會包含在html標簽中。

編輯:忘記提及它,它會在您登錄后重定向期間發生!

編輯:

   <?php 

    require 'autoload.php';



use Parse\ParseClient;
use Parse\ParseObject;
use Parse\ParseQuery;
use Parse\ParseACL;
use Parse\ParsePush;
use Parse\ParseUser;
use Parse\ParseInstallation;
use Parse\ParseException;
use Parse\ParseAnalytics;
use Parse\ParseFile;
use Parse\ParseCloud;
use Parse\ParseRelation;
use Parse\ParseSessionStorage;

session_start();
ParseClient::initialize( $app_id, $rest_key, $master_key );

$currentUser = ParseUser::getCurrentUser();

if ($currentUser) {

} else {

header("Location: http://rev-u.co/login");
exit();

}

?>

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
  <link rel="stylesheet" href="css/bootstrap.css">
  <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
  <link href='http://fonts.googleapis.com/css?family=Noticia+Text' rel='stylesheet' type='text/css'>

  <script src="//www.parsecdn.com/js/parse-1.3.2.min.js">
  </script>
  <link rel="stylesheet" href="/css/normalize.css">
  <link rel="stylesheet" href="/css/style.css">
  <link rel="stylesheet" href="/css/home.css">
  <link rel="stylesheet" href="/css/responsive.css">


  <link href='http://fonts.googleapis.com/css?family=Raleway:400' rel='stylesheet' type='text/css'>
  <link href='http://fonts.googleapis.com/css?family=Slabo+27px' rel='stylesheet' type='text/css'>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
  </script>

  <script src="/js/star-rating.min.js" type="text/javascript">
  </script>
  <link href="/css/star-rating.min.css" media="all" rel="stylesheet" type="text/css"/>
  <script type="text/javascript" src="/js/bootstrap.js">
  </script>
  <script type="text/javascript" src="/js/centralpage.js">
  </script>
  <meta name="viewport" content="width=device-width">

  </head>
  <header>
    <div class="logo">
      <h1 class="brand">
        Rev-u
      </h1>
    </div>
    <div class="topbuttons">
      <form action="/logout.php">
        <button type="submit" class="btn btn-primary" id="login">
          Logout
        </button>
      </form>
      <button class="btn btn-secondary" id="profilebutton">
        My Profile
      </button>
      <a href="index">
        <button class="btn btn-secondary active" id="homebutton">
          Home
        </button>
      </a>
    </div>
  </header>
  <div class="wrapper">
    <div class="recentfeedcontainer">
      <h3>
        Recent Reviews:
      </h3>

      <div class="loadercontainer">
        <div id="circularG" class="recentloader">
          <div id="circularG_1" class="circularG">
          </div>
          <div id="circularG_2" class="circularG">
          </div>
          <div id="circularG_3" class="circularG">
          </div>
          <div id="circularG_4" class="circularG">
          </div>
          <div id="circularG_5" class="circularG">
          </div>
          <div id="circularG_6" class="circularG">
          </div>
          <div id="circularG_7" class="circularG">
          </div>
          <div id="circularG_8" class="circularG">
          </div>
        </div>
      </div>

 <?php
$url;
$currentfriend;
$friendname;

// $currentUser

$relation = $currentUser->getRelation("FriendRelations");
$results = $relation->getQuery()->find();

if (count($results) != 0)
    {
    for ($i = 0; $i < count($results); $i++)
        {
        $object = $results[$i];
        if ($results[$i]->get("profilePicture") != null)
            {
            $url = $results[$i]->get("profilePicture")->getUrl();
            }
          else
            {
            $url = "img/batmanfacebook.jpg";
            }

        $currentfriend = $results[$i]->get("username");
        if ($results[$i]->get("name") != null) $friendname = $results[$i]->get("name");
          else $friendname = $currentfriend;
        $query = new ParseQuery("Reviews");
        $query->equalTo("User", $currentfriend);
        $query->descending("createdAt");
        $result = $query->first();

        // $review = $result->

        get("text");

        // $rate = $result->

        get("Rating");
        if (count($result) > 0) echo '
<div id = "reviewitem" class=reviewitem_"' . $i . '">
<input id="input-id' . $i . '" type="number" class="rating" min=0 max=5 step=1 data-size="xs" data-show-caption="false" data-show-clear="false" readonly="false">
<div id = "reviewimgcontainer" class="reviewimgcontainer_' . $i . '">
<img src="' . $url . '">
<h5>
<a href="/u/' . $currentfriend . '">
' . $friendname . '
</a>
</h5>
</div>
<p>
' . $result->get("text") . '
</p>
</div>
';
        }

?>
      <script type="text/javascript">


        $('.loadercontainer').addClass('hidden');


      </script>

      <?php
    }


?>


      </div>
  </div>

  <div class="friendscontainer">
    <h3>
      Following
    </h3>

    <ul>


    </ul>


    <div class="loadercontainer">
      <div id="circularG">
        <div id="circularG_1" class="circularG">
        </div>
        <div id="circularG_2" class="circularG">
        </div>
        <div id="circularG_3" class="circularG">
        </div>
        <div id="circularG_4" class="circularG">
        </div>
        <div id="circularG_5" class="circularG">
        </div>
        <div id="circularG_6" class="circularG">
        </div>
        <div id="circularG_7" class="circularG">
        </div>
        <div id="circularG_8" class="circularG">
        </div>
                  </div>
    </div>


</div>



<div class="friendstab">
<img style="border-radius:5px; box-shadow: 0px 0.5px 1.2px 0.5px;
margin-top:235px; width:40px; height:40px" src="img/friends.png">
</div>



</html>

PHP在服務器上執行,然后將結果發送到瀏覽器。 瀏覽器永遠不會看到任何PHP代碼。 您一定做錯了其他事情。 也許最好與我們分享您的完整代碼。

任何輸出發送到客戶端之前,請始終執行數據庫查詢和密集循環。 您的代碼一般結構應如下所示:

<?php
    // Some code hat pulls data from a database. This involves queries, for loops, etc.
?>
<!doctype html>
<html lang=en>
    <head>
        <meta charset=utf-8>
        <title>blah</title>
    </head>
    <body>
        <p>I'm the content</p>
    </body>
</html>

確實應該投票結束這一點,因為它太廣泛了,但是有些提示可能會指出正確的方向...

查看您的網絡瀑布(開發人員工具)。 這將告訴您延遲是否確實在HTML生成中發生。 除非您進行了顯式刷新(否則有時會有充分的理由),否則您會得到分塊的響應,這是非常不尋常的。 當然,它與結束標記的放置位置無關 如果問題出在您的PHP上,請使用探查器來隔離問題。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM