使用 AJAX 从 databse 填充 HTML 下拉列表 - Populating HTML dropdown from databse using with AJAX

Populating HTML dropdown from databse using with AJAX

我按照教程使用 AJAX 动态填充下拉列表。这是我的代码配置.php

<?php
$con = mysql_connect("localhost", "root","");
if(!$con){
    die('Could not connect:' .mysql_error());
}
mysql_select_db('carrental', $con);?>

vehicle_dropdown.php

<?php
include('config.php');
$sql=mysql_query("SELECT vehicleid,vehiclename FROM tbl_vehicles");
if(mysql_num_rows($sql)){
    $data = array();
    while (&row=mysql_fetch_array($sql)){
        $data[] = array(
            'id' => $row['vehicleid'],
            'name' => $row['vehiclename']
        );    
    }
    header('Content-type: application/json');
    echo json_encode($data);
}?>

车辆.php

    <?php
    include('config.php');
?>
<html>
    <head>
        <title>Test</title>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
        <script type="text/javascript">
            function Vehicle() {
                $('#vehicledll').empty();
                $('#vehicledll').append("<option>Loading.....</option>");
                $.ajax({
                    type: "POST",
                    url: "vehicle_dropdown.php",
                    contentType: "application/json charset=utf-8",
                    dataType: "json",
                    success: function (data) {
                        $('#vehicledll').empty();
                        $('#vehicledll').append("<option value='0'>--Select Country--</option>");
                        $each(data, function (i, item) {
                            $('#vehicledll').append('<option value="' + data[i].id + '">' + data[i].name + '</option>');
                        });
                    },
                    complete: function () {
                    }
                });
            }
            $(document).ready(function () {
                Vehicle();
            });
        </script>
    </head>
    <body>
        <select id="vehicledll"></select>
    </body>
</html>

但是，当我运行页面时，dopdown 仅显示消息"正在加载...."请帮忙

$each(data, function (i, item) {
                            $('#vehicledll').append('<option value="' + data[i].id + '">' + data[i].name + '</option>');
                        });

应该是

$.each(data, function (i, item) {
                            $('#vehicledll').append('<option value="' + data[i].id + '">' + data[i].name + '</option>');
                        });

您在$后错过了.

contentType应该contentType: "application/json; charset=utf-8",