如何使用 jQuery 填充级联下拉列表以提高浏览器兼容性？

使用 jQuery 填充级联下拉列表

背景

您在尝试使用 HTML 和 HTML 制作具有动态级联下拉列表的表单时遇到了挑战JavaScript。您最初的 JavaScript 代码可以运行，但 Internet Explorer 中出现了兼容性问题。因此，您正在寻求过渡到 jQuery 以增强兼容性。

解决方案

问题的解决方案非常简单：

<br> jQuery(function($) {<pre class="brush:php;toolbar:false">var locations = {
    'Germany': ['Duesseldorf', 'Leinfelden-Echterdingen', 'Eschborn'],
    'Spain': ['Barcelona'],
    'Hungary': ['Pecs'],
    'USA': ['Downers Grove'],
    'Mexico': ['Puebla'],
    'South Africa': ['Midrand'],
    'China': ['Beijing'],
    'Russia': ['St. Petersburg'],
}

var $locations = $('#location');
$('#country').change(function () {
    var country = $(this).val(), lcns = locations[country] || [];

    var html = $.map(lcns, function(lcn){
        return '<option value="' + lcn + '">' + lcn + '</option>'
    }).join('');
    $locations.html(html)
});

});

演示

在 [小提琴]（小提琴链接在这里）。

以上是如何使用 jQuery 填充级联下拉列表以提高浏览器兼容性？的详细内容。更多信息请关注PHP中文网其他相关文章！