使用 javascript 和 php 循環 Div

Question

我有兩個文件，1 個 html 和 1 個 php。 我想將數據從 php 文件加載到我的 html 文件我的 php 文件代碼

    include_once("db.php");
    $query ="select b.ID,b.title,b.description, b.image,b.publish_date,u.fullname from c_blog b left join user u on b.publish_by=u.loginid order by b.publish_date desc ";
    $result = mysqli_query($con,$query);
    foreach($result as $data) {
        //echo $data["image"].'---';
        echo '  <div class="blog-post">
        <div class="post-image">
            <a href="blog-single.html"><img src="blogimage/'.$data["image"].'" width="400" height="400" alt=""> </a>
        </div>
        <ul class="post-meta">
            <li class="post-author">by '.$data["fullname"].'</li>
            <li><i class="icon icon-clock"></i>'.$data["publish_date"].'</li>
            <li><i class="icon icon-talk"></i></li>
        </ul>
        <div class="inside">
            <h2 class="post-title"><a href="blog-single.html">'.$data["title"].'</a></h2>
            <div class="post-teaser">
                <p>'.$data["description"].'</p>
            </div>
        </div>
    </div>';
    }
    ?>

我的 html 文件代碼是

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="https://code.jquery.com/jquery-2.1.1.min.js"
    type="text/javascript"></script>
    <script>
        function onPageLoad() {
            //alert("testing");
            loadpost();

        }
        function loadpost(){
            $.ajax({          
                    type: "POST",
                    url: "loadpost.php",
                    data:'',
                    success: function(data){
                    $("#blogpost").load(data);
                    //alert(data);
                }
            });

        }

    </script>
</head>

<body onload="onPageLoad();" class="home layout-2">

    <div id="page-content">
        <div class="container">
            <h1 class="text-center">Blog <span class="color">Posts</span></h1>
            <div class="row">
                <div class="col-md-9 column-center">
                    <div id="blogpost" name="blogpost">
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>

我想從數據庫中加載數據並在 div 中循環打印。 我的 PHP 代碼正在運行並打印 div。 但我不知道如何將 php echo 結果打印到我的 html 頁面。

提前致謝

Answer 1

在您的 PHP 文件中，將您要回顯的元素放在一個變量中。 你應該只回聲一次。 所以試試這個......

include_once("db.php");
$output = '';
$query ="select b.ID,b.title,b.description, b.image,b.publish_date,u.fullname from c_blog b left join user u on b.publish_by=u.loginid order by b.publish_date desc ";
$result = mysqli_query($con,$query);
foreach($result as $data) {
    //echo $data["image"].'---';
    $output .= '  <div class="blog-post">
    <div class="post-image">
        <a href="blog-single.html"><img src="blogimage/'.$data["image"].'" width="400" height="400" alt=""> </a>
    </div>
    <ul class="post-meta">
        <li class="post-author">by '.$data["fullname"].'</li>
        <li><i class="icon icon-clock"></i>'.$data["publish_date"].'</li>
        <li><i class="icon icon-talk"></i></li>
    </ul>
    <div class="inside">
        <h2 class="post-title"><a href="blog-single.html">'.$data["title"].'</a></h2>
        <div class="post-teaser">
            <p>'.$data["description"].'</p>
        </div>
    </div>
</div>';
}

echo $output;
    ?>

在你的 ajax 成功函數中，輸入：

$("#blogpost").html(data);

使用 javascript 和 php 循環 Div

問題描述

1 個解決方案

解決方案1
1 已采納 2020-02-06 03:58:13

使用 javascript 和 php 循環 Div

問題描述

1 個解決方案

解決方案1 1 已采納 2020-02-06 03:58:13

解決方案1
1 已采納 2020-02-06 03:58:13