javascript - 根据自动完成值填充下拉列表

Question

我有国家(文本输入)、城市(文本输入)和街道(下拉)三个表单字段:

• 国家是自动完成的
• 城市是根据国家/地区的结果自动填充的
• 街道我想根据所选城市生成下拉列表

这是我当前的 JavaScript 脚本:

$(".country").autocomplete("get_city.php",{ mustMatch:true })   
  .result(function (evt, data, formatted) {
    $(".city").val(data[1]);
});  

到目前为止，它正在自动填充城市(文本输入)。

我现在的问题是根据填充的城市生成下拉列表。

Answer 1

我想你需要这样的东西:

$(".country").change(function () {

    var webMethod = "filewithdata.php";
    var parameters = { id: $('.country').val() };
    $.ajax({
        type: "GET",
        url: webMethod,
        data: parameters,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (response) {

            //console.log(response);

            json_obj = $.parseJSON(response);

            var output = '';

            for (var i in json_obj) {
                if (json_obj[i][4] == 1) {

                    output += '<option value="' + json_obj[i][0] + '">' + json_obj[i][0] + '</option>'
                }

            }

            $('#dropdownElement').empty().append(output);

        },
        error: function (e) {
            $(divToBeWorkedOn).html("Unavailable");
            alert("Errror:" + e);
        }
    });

});