jQuery文档就绪调用序列

时间:2013-01-01 16:59:48

标签: javascript jquery

我对jQuery有以下问题。我使用这段代码:

function populate_select_from_json(select, json_url) {
    select.empty();
    $.getJSON(json_url, function(data) {
        $.each(data, function(key, value) {
            $("<option></option>")
                .attr("value", value.name)
                .text(value.title)
                .appendTo(select);
        });
    });
    select.children(":first").attr("selected", true);
}
$(document).ready(function() {
    var value_type = $("#value_type");
    populate_select_from_json(value_type, SOME_URL);

    var unit = $("#unit");
    populate_select_from_json(unit, ANOTHER_URL + value_type.val());

});

我想:

  1. 加载文档
  2. 从关联数据库中获取一些JSON数据
  3. 将数据放入#value_type <select> item
  4. 获取#value_type select的值,然后再次查询数据库以填充另一个选择项。
  5. 问题是,当我致电value_type.val()时,即使null已正确填充,它也会始终输出#value_type <select>。我在这里做错了什么?

1 个答案:

答案 0 :(得分:2)

我认为这样的事情可能会更好地与promises一起使用。

沿着这些方向(未经测试):

var populate_select_from_json = function($select, json_url) {
    $select.empty();
    return $.getJSON(json_url, function(data) {
        $.each(data, function(key, value) {
            $("<option></option>")
                .attr("value", value.name)
                .text(value.title)
                .appendTo($select);
        });
        $select.children(":first").attr("selected", true);
    });
};

$(document).ready(function() {
    var $value_type = $("#value_type");
    var $unit = $("#unit");

    populate_select_from_json($value_type, SOME_URL).done(function(){
      populate_select_from_json($unit, ANOTHER_URL + $value_type.val());
    });
});