jq 地区(省市县区)联动菜单

页面导航:首页 > 网络编程 > JavaScript > jq 地区(省市县区)联动菜单

jq 地区(省市县区)联动菜单

来源: 作者: 时间:2016-01-23 10:23 【

4、地区数据下载地址http: download csdn net detail u011064186 76900893、ajax 部分public function actionAjax(){ $id = $_GET[pid]; $sq



3、ajax 部分
public function actionAjax()
	{
            $id = $_GET['pid'];
            $sql = "select code,name from area where parentId = $id";
            $arr = Yii::app()->db->createCommand($sql)->queryAll();
            $arr = json_encode($arr);
            print_r($arr);
	}



2、html 部分

    


    
    


    
    


    
    


1、jq部分

<script>
    $(document).ready(function() {
        $('#province1').bind('change', function() {
            $("#c").css('display', 'inline-block');

            $("#to").css('display', 'none');
            $("#co").css('display', 'none');
            var pid = $(this).val();
            if (pid == '-1') {
                $("#c").css('display', 'none');
            }

            $.ajax({
                type: "get",
                url: "/index.php/site/ajax",
                data: {
                    pid: pid,
                },
                success: function(json) {
                    //alert(json);
                    var data = eval('(' + json + ')');//json转化为对象
                    var str = "";
                    for (var i = 0; i < data.length; i++) {
                        // alert(data[i].name);
                        console.log(str += "");
                        $("#city").empty();
                        $("#city").append("");
                        $("#city").append(str);

                    }
                }
            });

        });
    });
    $(document).ready(function() {
        $('#city').bind('change', function() {
            $("#co").css('display', 'inline-block');
            $("#to").css('display', 'none');

            var pid = $(this).val();
            $.ajax({
                type: "get",
                url: "/index.php/site/ajax",
                data: {
                    pid: pid,
                },
                success: function(json) {
                    // alert(json);
                    var data = eval('(' + json + ')');//json转化为对象
                    var str = "";
                    for (var i = 0; i < data.length; i++) {
                        //alert(data[i].name);
                        str += "";
                        $("#county").empty();
                        $("#county").append("");
                        $("#county").append(str);

                    }
                }
            });
        });
    });
    $(document).ready(function() {
        $('#county').bind('change', function() {
            $("#to").css('display', 'inline-block');
            var pid = $(this).val();
            $.ajax({
                type: "get",
                url: "/index.php/site/ajax",
                data: {
                    pid: pid,
                },
                success: function(json) {
                   // alert(json);
                    var data = eval('(' + json + ')');
                    var str = "";
                    for (var i = 0; i < data.length; i++) {
                        //alert(data[i].name);
                        str += "";
                        $("#town").empty();
                        $("#town").append("");
                        $("#town").append(str);

                    }
                }
            });
        });
    });
</script>


Tags:

文章评论

最 近 更 新
热 点 排 行
Js与CSS工具
代码转换工具

<