zoukankan      html  css  js  c++  java
  • Ajax取PHP JSON数据并显示

    <!DOCTYPE html>
    <html lang="zh">
    
        <head>
            <meta charset="UTF-8" />
            <meta name="viewport" content="width=device-width, initial-scale=1.0" />
            <meta http-equiv="X-UA-Compatible" content="ie=edge" />
            <script src="js/jquery-3.3.1.js" type="text/javascript" charset="utf-8"></script>
            <title>Document</title>
        </head>
    
        <body style="padding-top: 30px;">
            <button id="btnJson">JSON</button>
            <table class="table"></table>
            <script type="text/javascript">
                $(function() {
                    $("#btnJson").click(function() {
                        $.ajax({
                            type: "get",
                            url: "json.php",
                            dataType: "json",
                            async: true,
                            success: function(data) {
                                var item;
                                $.each(data, function(i, result) {
                                    item = "<tr><td>" + result['city'] + "</td><td>" + result['phone'] + "</td></tr>";
                                    $('.table').append(item);
                                });
                            }
                        });
                    })
                })
            </script>
        </body>
    
    </html>

    JSON.PHP

    <?php
        $host = '127.0.0.1';
        $user = 'root';
        $password = '';
        $database = 'yiibaidb';
        $conn = new mysqli($host, $user, $password, $database);
        if (!$conn) {
            die("数据库连接失败!" . $conn -> connect_error);
        }
        $sql = "SELECT * FROM `offices`";
        $result = $conn -> query($sql);
        $arr = array();
        if ($result -> num_rows > 0) {
            while ($rows = $result -> fetch_assoc()) {
                $arr[] = $rows;
            }
        }
        echo json_encode($arr);
        $conn -> close();
    ?>
  • 相关阅读:
    Word Puzzles [POJ 1204]
    set用法
    FOJ有奖月赛2012年11月
    BerDonalds
    POJ1469 匈牙利算法
    后缀数组
    ZOJ Monthly, January 2013
    算法导论<一>
    Yell Classico
    点聚 WebOffice 编辑辅助控件 WebOffice.OCX
  • 原文地址:https://www.cnblogs.com/liessay/p/8359951.html
Copyright © 2011-2022 走看看