Javascript 如何让这个ajax下拉选择器在所有浏览器中工作？

我写了这段代码，用ajax调用的结果填充一个框

(function() {
    var cache = {};
    var queue = {};

    $('select.country').live('change', function() {
        var $countrySel = $(this);
        var $provSel = $countrySel.closest('tr,.label-and-input').next().find('select.province');
        var $provInput = $provSel.siblings('input.province');
        var country = $countrySel.val();
        var province = $provInput.val();

        $provSel.empty();
        if(country == '' || country == null) {
            $provSel.trigger('change');
            return;
        }

        if(country in cache) {
            addOptions($provSel, cache[country]);
        } else if(country in queue) {
            $provSel.addClass('loading');
            queue[country].push($provSel);      
        } else {
            $provSel.addClass('loading');
            queue[country] = [$provSel]
            $.getJSON('/get-provinces.json', {country:country}, function(provinces) {
                cache[country] = provinces;
                while(queue[country].length > 0) {
                    var $select = queue[country].pop();
                    $select.removeClass('loading');
                    addOptions($select, cache[country]);    
                }                               
            });
        }
    }).trigger('change');
})();

function addOptions($select, options) {
    $select.append('<option value="">- Select -</option>');
    for(var i in options) {
        $select.append('<option value="{0}">{1}</option>'.format(options[i][0], options[i][1]));
    }
    $select.val($select.siblings('input:first').val()).trigger('change');
}

---

省选择实际上是动态添加的，并且在更改时更新隐藏字段。必须这样做才能使它正确地与Django接口，并很好地降级。

不确定，如果这有帮助的话。我在AJAX请求后填充s时遇到了一些问题，我想是IE出了问题

我可以通过在将s添加到之前添加1毫秒延迟来解决这些问题：

---

您可以试一试吗…

您可以指定“一些浏览器”吗？你的客户使用什么？你能包含相应的HTML片段吗？是代码中的错误“``tr、.label和input``还是仅存在于问题文本中？它应该是不带逗号的“tr.label-and-input”。@Marcel：我想是IE7，可能是8。WindowsVista。他们并没有在错误报告中包含这些信息；我已经在IE8/Win7上进行了测试，效果很好。我认为，在ajax调用完成之前，您真的必须处理它，来回切换以使其中断@奥列格：就像我说的，在其他浏览器中也可以正常工作。选择器是正确的，应该是这样的。如果你想要一块HTML，我会把它包括进去，但问题不在于选择正确的元素。仅供参考，选择器之所以这样是因为我有一些表格，它们被放在表格中——标签在输入旁边——还有其他更紧凑的表格，标签在输入上面。我会尝试一下。。。似乎是一个奇怪的黑客。是的，我同意，但这是我找到的克服IE奇怪行为的唯一方法。。。

<tr class="address province">
    <th class="label-cell">
        <label for="id_pickup_address-province">
            Province/State
        </label>
    </th>
    <td class="field-cell">
        <input style="display: none;" id="id_pickup_address-province" class="address province" value="BC" name="pickup_address-province" type="text"><select class="province address"><option value="">- Select -</option><option value="AB">Alberta</option><option value="BC">British Columbia</option><option value="MB">Manitoba</option><option value="NB">New Brunswick</option><option value="NF">Newfoundland and Labrador</option><option value="NT">Northwest Territories</option><option value="NS">Nova Scotia</option><option value="NU">Nunavut</option><option value="ON">Ontario</option><option value="PE">Prince Edward Island</option><option value="QC">Quebec</option><option value="SK">Saskatchewan</option><option value="YT">Yukon</option></select>
    </td>
</tr>

$.getJSON('/get-provinces.json', {country:country}, function(provinces) {
    setTimeout(function() {
        cache[country] = provinces;
        while(queue[country].length > 0) {
            var $select = queue[country].pop();
            $select.removeClass('loading');
            addOptions($select, cache[country]);    
        }
    }, 1); // 1 millisecond delay
});