城市二级联动及只改变城市无法选中id值的解决办法代码示例

最新推荐文章于 2020-07-09 18:37:21 发布

转载最新推荐文章于 2020-07-09 18:37:21 发布 · 154 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/chen1970s/p/7122252.html

本文介绍了一种使用Ajax技术动态加载省市数据的方法，并通过jQuery实现了根据所选省份自动更新城市下拉列表的功能。该方法适用于需要根据用户选择动态改变选项的应用场景。

    $(function (id) {
        function changge(id){
            $("select[name='city']").click(function(){
                $(this).find("option[value='"+id+"']").prop("selected","selected")
            })
        }
        $("button[type='submit']").click(function(){
            var uid = $("select[type='city']").val();
            changge(uid);
        });
        //ajax根据省份获取对应的城市和地区
        $('#province').change(function () {
            var id = $(this).val();
            console.log(id);
            if (id == 0) {
                $('#city').html('<option value="0">请选择城市</option>');
//                $('#area').html('<option value="0">请选择地区</option>')
                return false;
            }
            $.get('/ajax_city', {id: id}, function (data) {
                var html = '';
                var area = '';
                $.each(data.city, function (i, n) {
                    html += '<option value="' + n.id + '">' + n.name + '</option>';

                });
//                $.each(data.area, function (k, v) {
//                    area += '<option value="' + v.id + '">' + v.name + '</option>';
//
//                 });
                $('#city').html(html);
//                $('#area').html(area);
            }, 'json');
        });

    })

转载于:https://www.cnblogs.com/chen1970s/p/7122252.html