下拉列表中未显示数据

时间:2016-03-22 19:52:45

标签: javascript html ajax

我是javascipt的新手,这是我的第一个节目。 我已经编写了html javascrpit代码来显示来自python django数据库的下拉列表中的数据但是当我运行它时,它没有显示数据我的代码是

<!DOCTYPE html>
<html>
    <title>CP Project</title>
    <head>

    </head>
    <body>
        Country : <select class="country" onchange="changeCountry(this)">

        </select><br/>
        State : 
        <select class="state" onchange="changeState(this)">

        </select><br/>
        City : 
        <select class="city" onchange="changeCity(this)">

        </select>

        <script>
            var country = document.querySelector(".country");
            var state = document.querySelector(".state");
            var city = document.querySelector(".city");

            var countryList = {};
            var stateList = {};
            var cityList = {};
            // Access-Control-Allow-Origin: http://127.0.0.1:8002/data/ ;
            Access-Control-Allow-Methods: POST, GET, OPTIONS;

            getCountryList(function(response){
                countryList = response;
                var tempStr = "";
                /*for(var i in response.result){
                    tempStr+="<option value="+i+">"+response.result[i]+"</option>";
                }*/
                for(var i=0;i<response.length; i++){
                    tempStr+="<option value="+response[i].countryId+">"+response[i].country+"</option>";
                }
                country.innerHTML = tempStr;
            });

            function changeCountry(this_){

                getStateList(this_.value, function(response){
                    stateList = response;
                    var tempStr = "";
                    /*for(var i in response.result){
                        tempStr+="<option value="+i+">"+response.result[i]+"</option>";
                    }*/
                    for(var i=0;i<response.length; i++){
                        tempStr+="<option value="+response[i].state_id+">"+response[i].state+"</option>";
                    }
                    http.open("GET", "http://127.0.0.1:8002/data/country/", true);
                    http.send();
                    state.innerHTML = tempStr;
                });
            }

            function changeState(this_){

                getCityList(this_.value, function(response){
                    cityList = response;
                    var tempStr = "";
                    /*for(var i in response.result){
                        tempStr+="<option value="+i+">"+response.result[i]+"</option>";
                    }*/
                    for(var i=0;i<response.length; i++){
                        tempStr+="<option value="+response[i].cityid+">"+response[i].city+"</option>";
                    }
                    city.innerHTML = tempStr;
                });
            }


            function getCountryList(callBackFun){
                var http = new XMLHttpRequest();
                http.onreadystatechange = function(){
                    if (this.readyState === 4){
                        callBackFun(JSON.parse(this.responseText));
                    }
                };
                http.open("GET", "http://127.0.0.1:8002/data/country/", true);
                http.send();
            }

            function getStateList(countryCode, callBackFun){
                var http = new XMLHttpRequest();
                http.onreadystatechange = function(){
                    if (this.readyState === 4){
                        callBackFun(JSON.parse(this.responseText));
                    }
                };
                http.open("GET", "http://127.0.0.1:8002/data/state?count_id="+countryCode, true);
                http.send();
            }

            function getCityList(stateCode, callBackFun){
                var http = new XMLHttpRequest();
                http.onreadystatechange = function(){
                    if (this.readyState === 4){
                        callBackFun(JSON.parse(this.responseText));
                    }
                };
                http.open("GET", "http://127.0.0.1:8002/data/cities/?sta_id="+stateCode, true);
                http.send();
            }
        </script>
    </body>
</html>

显示两个警告

1.SyntaxError: missing ; before statement
2.The character encoding of the HTML document was not declared. The document will render with garbled text in some browser configurations if the document contains characters from outside the US-ASCII range. The character encoding of the page must be declared in the document or in the transfer protocol.

1 个答案:

答案 0 :(得分:0)

好吧,你可能错过了一个分号。

并添加

<meta charset="UTF-8"> 

应该解决底部错误。