javascript - 填充 AJAX javascript/jQuery 下拉列表(省、州、城市)有时会给出未定义的结果

Question

我目前使用的是jquery-1.11.1.min.js。我有三个不同的下拉菜单:省、州、城市，并且我有以下 javascript 来处理用户选择省、州或城市时的更改。

$provinceSelector = $('.selector-province');
$stateSelector = $('.selector-state');
$citySelector = $('.selector-city');

$provinceSelector.on('change', function () {
        var provinceid = $(this).val();
        $stateSelector.html('<option value>Loading...</option>');
        $stateSelector.attr('disabled','true');
        $.ajax({
            url: '/location/states/' + provinceid,
            timeout: 20000,
            type: 'GET',
            data: [],
            success: function (response) {
                if (!response.status || response.states.length == 0)
                {
                    $provinceSelector.val('');
                    $stateSelector.html('<option value>Pilih kabupaten lokasi toko kamu</option>');
                }
                else if (response.status && response.states.length > 0 && $stateSelector)
                {
                    $stateSelector.removeAttr('disabled');
                    $stateSelector.html('<option value>Pilih kabupaten</option>');
                    for (var i = 0; i < response.states.length; i++)
                    {
                        $stateSelector.append('<option value="' + response.states[i].id + '">' + response.states[i].name + '</option>');
                    }
                }
            },
            error: function (x, t, m) {
                $provinceSelector.val('');
                $stateSelector.html('<option value>Pilih kabupaten lokasi toko kamu</option>');
            },
        });
    });

服务器返回的端点如下所示:

{"status":true,"cities":[{"id":67,"name":"Alas"},{"id":68,"name":"Alas Barat"},{"id":472,"name":"Batu Lanteh"},{"id":1233,"name":"Empang"},{"id":2276,"name":"Labangka"},{"id":2283,"name":"Labuhan Badas"},{"id":2338,"name":"Lape-Lopok"},{"id":2547,"name":"Lunyuk"},{"id":2919,"name":"Moyohilir"},{"id":2920,"name":"Moyohulu"},{"id":3605,"name":"Plampang"},{"id":3936,"name":"Ropang"},{"id":4603,"name":"Sumbawa"},{"id":4604,"name":"Sumbawa Besar"},{"id":5265,"name":"Utan-Rhee"}]}

如果发生错误，它也可以返回状态 false。现在的问题是，有几次我收到用户的报告，他们在选择省份后在该州看到未定义(换句话说，该州没有选项，只是未定义)，这通常在移动设备上。我想知道这怎么可能？我想我正在处理所有可能的情况。有什么想法/提示吗？

Answer 1

如前所述 - 检查/验证未定义(if/try catch...)并在服务器上进行一些登录以查看发生了什么:)

还有另一个提示 - 移动设备可能会出现信号覆盖不良/超时等情况 - 这就是您可能设置 20 秒超时的原因。这将是我调试的下一步。