文章/答案/技术大牛

发布

社区首页 >问答首页 >使用javascript和php的循环Div

问使用javascript和php的循环Div
EN

Stack Overflow用户

提问于 2020-02-06 03:37:41

回答 1查看 290关注 0票数 0

我有两个文件，一个html和一个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回显结果打印到我的html页面。

提前谢谢

html

ajax

syntax

javascript

php

回答 1

Stack Overflow用户

回答已采纳

发布于 2020-02-06 03:58:13

在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);

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/60087378

复制

相似问题

问使用javascript和php的循环Div
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用javascript和php的循环DivEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用javascript和php的循环Div
EN