Javascript MySql-JSON数据不显示在html中_Javascript_Jquery_Html_Ajax_Json

Javascript MySql-JSON数据不显示在html中

javascript jquery html ajax json

Javascript MySql-JSON数据不显示在html中,javascript,jquery,html,ajax,json,Javascript,Jquery,Html,Ajax,Json,我正在尝试从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

我正在尝试从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....";
});

$（文档）.ready（函数（）{
var ddlist=document.getElementById（“ddlist”）；
var hr=新的XMLHttpRequest（）；
hr.open（“GET”，“json\u mysql\u data2.php”，true）；
hr.setRequestHeader（“内容类型”、“应用程序/x-www-form-urlencoded”）；
hr.onreadystatechange=函数（）{
如果（hr.readyState==4&&hr.status==200）{
var d=JSON.parse（hr.responseText）；
用于（变量o在d中）{
如果（d[o].标题）{
ddlist.innerHTML+='您的innerHTML
是错误的。您在开始时有一个额外的
，您缺少
的结束
。您的选项中也没有任何文本，因此菜单项都将为空
您还应该附加到
而不是

hr.onreadystatechange=function（）{
如果（hr.readyState==4&&hr.status==200）{
var d=JSON.parse（hr.responseText）；
var empList=document.getElementById（“empList”）；
用于（变量o在d中）{
如果（d[o].标题）{
empList.innerHTML+=''+d[o].title+''；
}
}
}
}
ddlist.innerHTML+='为什么在每个
之前都添加一个额外的
？在dom元素中也有一些类似额外的错误，您将其添加到select中的一个div中，这是一个不好的做法，尽管如此。谢谢。这并没有解决问题。我怀疑
是否真的在中工作>可能是真的。为什么不附加到
而不是
？我已经考虑过了，但我不确定如何获得“选择学生ID”作为第一项，以及如何获得onchange='document.getElementById（“val1”）.value=this.value；'>由于要连接到内部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>

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>';
            }
        }
    }
}

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

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