Question

我试图从MySql创建一个下拉列表。

php成功从MySql中获取数据。但我的问题是我的HTML页面的下拉列表中没有显示数据？

json_mysql_data2.php

header("Content-Type: application/json");
require_once("con.php");
$i=0;
$jsonData = array();
foreach ($conn_db->query("SELECT customerID FROM customers WHERE furniture='33' ") as $result){
        $i++;
        $jsonData["article".$i]=$result['customerID'];
    }
echo json_encode($jsonData);

myJS.js

$(document).ready(function(){
    var ddlist = document.getElementById("ddlist");
    var hr = new XMLHttpRequest();
    hr.open("GET", "json_mysql_data2.php", true);
    hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    hr.onreadystatechange = function() {
        if(hr.readyState == 4 && hr.status == 200) {
            var d = JSON.parse(hr.responseText);
            for(var o in d){
                if(d[o].title){
                    ddlist.innerHTML += '</option><option value='+d[o].title+'</option>';
                }
            }
        }
    }
    hr.send("null");
    ddlist.innerHTML = "Loading Customer ID....";
});

HTML

<script src="myJS.js" type="text/javascript"></script>
</head>
<body>
<div class="dlist">
        Customer ID: 
        <select id='EmpLst' name="dwlist" onchange='document.getElementById("val1").value = this.value;'><option value="">SELECT STUDENT ID</option>
        <div id="ddlist"></div>
        </select>
        </div>

Answer 1

您的innerHTML错了。您在开头有一个额外的</option>，您错过了>的结束<option>。您也没有选项中的任何文本，因此菜单项都将为空白。

您还应该添加到<select>而不是<div>。

hr.onreadystatechange = function() {
    if(hr.readyState == 4 && hr.status == 200) {
        var d = JSON.parse(hr.responseText);
        var empList = document.getElementById("EmpList");
        for(var o in d){
            if(d[o].title){
                empList.innerHTML += '<option value="'+d[o].title+'">'+d[o].title+'</option>';
            }
        }
    }
}

Answer 2

ddlist.innerHTML += '</option><option value='+d[o].title+'</option>';

应该是

ddlist.innerHTML += '<option value="'+d[o].title+'">'+d[o].title+'</option>';

MySql - 未在html中显示的JSON数据

2 个答案: