0

我创建了一个动态下拉列表,用户在其中选择一个州,下一个下拉菜单将显示该州的城市。这些代码适用于 Firefox,但不适用于 chrome。为什么会这样?

这是我的脚本:

<?php $cityurl = get_the_city()."/js/data.json";?>
<script type="text/javascript">
jQuery(document).ready(function($) {    

    var dataurl = "<?php echo $cityurl; ?>";
        $("#stateid").change(function location() {

            var $dropdown = $(this);
            $.getJSON(dataurl, function(data) {

                var key = $dropdown.val();
                var vals = [];

                switch(key) {
                    case 'State 1':
                        vals = data.city1.split(",");
                        break;
                    case 'State 2':
                        vals = data.city2.split(",");
                        break;  
                    case 'State 3':
                        vals = data.city3.split(",");
                        break;
                    case 'State 4':
                        vals = data.city4.split(",");
                        break;  
                    case 'All':
                        vals = ['Choose a State First'];
                }

                var $jsontwo = $("#cityid");
                $jsontwo.empty();
                $jsontwo.append("<option value='all'>All Regions</option>");
                $.each(vals, function(index, value) {
                    $jsontwo.append("<option value='" 
                                     + value + "'>" 
                                     + value 
                                     + "</option>");
                });
           });
    });
});  
</script>

我检查了控制台和 Firebug,但没有发现错误。任何想法?

4

0 回答 0