(function (w, $) {    //定义SelectSimulation的构造函数    var SelectSimulation = function (ele, opt) {        this.$element = ele,        this.defaults = {            ‘len‘: 3,            ‘def‘: [],            ‘ajax‘: [],            ‘dataname‘: ‘data‘,            ‘bind‘: [],//{ text: ‘text‘, val: ‘id‘ };            ‘isnullstr‘: ‘无‘        }        this.options = $.extend({}, this.defaults, opt)    }    //定义SelectSimulation的方法    SelectSimulation.prototype = {        temp: function (str, obj) {            return str.replace(/\{\$\w+\}/gi, function (matchs) {                var returns = obj[matchs.replace(/\{\$/g, "").replace(/\}/g, "")];                return (returns + "") == "undefined" ? "" : returns;            });        },        Info: {            tempstr: ‘ <div class="select-s-val"><a class="text-box"></a><input type="text" data-val="" readonly="readonly" /><a><i></i></a></div><div class="select-s-a"></div>‘,            tempstra: ‘<a class="a-item" data-val="{$val}" data-text="{$text}">{$text}</a>‘,            returndata: []        },        //main        Init: function () {            var _this = this;            this.$element.html(this.Info.tempstr);            if (_this.options.bind[0]) {                _this.Info.tempstra = ‘<a class="a-item" data-val="{$‘ + _this.options.bind[0].val + ‘}" data-text="{$‘ + _this.options.bind[0].text + ‘}">{$‘ + _this.options.bind[0].text + ‘}</a>‘;            }            if (this.options.def[0] == ‘undefined‘ && this.options.def.length === this.options.len) {                for (var i = 0, j = this.options.len; i < j; i++) {                    this.options.def.push({ text: ‘--请选择--‘, val: ‘-1‘ });                }            }            else {                //alert(‘不能正确执行‘);                //return false;            }            //初始化第一个容器            this.Finddata(this.options.ajax[0].url, this.options.ajax[0].data, function (data) {                //console.log(JSON.stringify(data));                var htmlstr = this.Binddata(data[this.options.dataname]);                var $element0 = this.$element.eq(0);                $element0.attr("data-type", ‘0‘);                $element0.find("div.select-s-a").html(htmlstr);                var $element_input = $element0.find("input");                var $alist = $element0.find("a.a-item");                $alist.click(function () {                    $element_input.val($(this).attr(‘data-text‘));                    $element_input.attr(‘data-val‘, $(this).attr(‘data-val‘));                    _this.Changedata.call(_this, (parseInt($element0.attr(‘data-type‘)) + 1), $(this).attr(‘data-val‘));                    $(this).parent().hide();                });            });            this.Bindfocus();            return this.Info.returndata;        },        //联动        Changedata: function (item, val) {            var _this = this;            if (item >= this.options.len) {                return;            }            this.options.ajax[item].data[this.options.ajax[item].data[‘def‘]] = val;            this.Finddata(this.options.ajax[item].url, this.options.ajax[item].data, function (data) {                //console.log(JSON.stringify(data));                var htmlstr = this.Binddata(data[this.options.dataname]);                var $element0 = this.$element.eq(item);                $element0.attr("data-type", item);                $element0.find("div.select-s-a").html(htmlstr);                var $element_input = $element0.find("input");                var $alist = $element0.find("a.a-item");                $alist.click(function () {                    $element_input.val($(this).attr(‘data-text‘));                    $element_input.attr(‘data-val‘, $(this).attr(‘data-val‘));                    _this.Changedata.call(_this, (parseInt($element0.attr(‘data-type‘)) + 1), $(this).attr(‘data-val‘));                    $(this).parent().hide();                });                if ($alist.length > 0) {                    $element_input.val($alist.eq(0).attr(‘data-text‘));                    $element_input.attr(‘data-val‘, $alist.eq(0).attr(‘data-val‘));                    _this.Changedata.call(_this, (parseInt($element0.attr(‘data-type‘)) + 1), $alist.eq(0).attr(‘data-val‘));                }                else {                    $element_input.val(_this.options.isnullstr[item] ? _this.options.isnullstr[item] : _this.options.isnullstr);                    $element_input.attr(‘data-val‘, ‘‘);                }            });        },        //数据处理        Binddata: function (data) {            if (data == null) return ‘‘;            var _this = this;            var _strall = ‘‘;            for (var i = 0, j = data.length; i < j; i++) {                _strall += _this.temp(_this.Info.tempstra, data[i]);            }            return _strall;        },        //通过ajax调数据        Finddata: function (url, data, fn) {            var _this = this;            $.ajax({                url: url,                type: "get",                data: data,                dataType: "json",                cache: false, //禁止缓存                success: function (obj) {                    fn.call(_this, obj);                }            });        },        //模拟系统焦点事件        Bindfocus: function () {            var _this = this;            this.$element.attr(‘tabindex‘, ‘1‘);            var _isoftrue = [];            this.$element.each(function (item) {                var $element_input = $(this).find("input");                $element_input.val(_this.options.def[item].text);                $element_input.attr(‘data-val‘, _this.options.def[item].val);                _isoftrue.push(false);            });            this.$element.click(function (event) {                event.preventDefault();                event.stopPropagation();                var _$this = $(this);                var _$selecta = _$this.find("div.select-s-a");                var _$selectval = _$this.find("div.select-s-val");                if (_$selecta.css(‘display‘) === ‘none‘) {                    _$selectval.removeClass(‘focuss‘).addClass(‘focuss‘);                    _$selecta.show();                }                else {                    _$selectval.removeClass(‘focuss‘);                    _$selecta.hide();                }            }).hover(function () {                _isoftrue[$(this).index()] = true;            }, function () {                _isoftrue[$(this).index()] = false;            });            this.$element.focusout(function () {                //alert($(this).index()+‘,‘+_isoftrue[$(this).index()]);                if (_isoftrue[$(this).index()]) return;                var _$this = $(this);                var _$selecta = _$this.find("div.select-s-a");                var _$selectval = _$this.find("div.select-s-val");                _$selectval.removeClass(‘focuss‘);                _$selecta.hide();            });            this.$element.find("div.select-s-a").click(function (event) {                event.preventDefault();                event.stopPropagation();            });        },        getText: function () {            var valuedata = http://www.mamicode.com/[];"input");                valuedata.push($element_input.val());            });            return valuedata;        },        getValues: function () {            var valuedata = http://www.mamicode.com/[];"input");                valuedata.push($element_input.attr(‘data-val‘));            });            return valuedata;        }    }    //在插件中使用SelectSimulation对象    $.fn.MySelect = function (options) {        //创建SelectSimulation的实体        var _CselectSimulation = new SelectSimulation(this, options);        if (typeof options != ‘object‘ && options != undefined) {            return _CselectSimulation[options]();        }        else {            _CselectSimulation.Init();        }    }})(window, $);

  //地区显示    $("div.select-simulation").MySelect({        ‘len‘: 3,        ‘def‘: [{ text: ‘--请选择省份‘, val: -1 }, { text: ‘--请选择城市‘, val: -1 }, { text: ‘--请选择区/县‘, val: -1 }],        ‘ajax‘: [{ url: ‘GetArea‘, data: { parentID: 0 } }, { url: ‘GetArea‘, data: { def: ‘parentID‘ } }, { url: ‘GetArea‘, data: { def: ‘parentID‘ } }],        ‘bind‘: [{ text: ‘AreaName‘, val: ‘AreaID‘ }, { text: ‘AreaName‘, val: ‘AreaID‘ }, { text: ‘AreaName‘, val: ‘AreaID‘ }],        ‘isnullstr‘: [‘无省份‘, ‘无城市‘, ‘无区/县‘]    });    $("#hudezi").click(function () {        alert($("div.select-simulation").MySelect(‘getValues‘)[0]);        alert($("div.select-simulation").MySelect(‘getValues‘)[1]);        alert($("div.select-simulation").MySelect(‘getValues‘)[2]);        alert($("div.select-simulation").MySelect(‘getText‘)[0]);        alert($("div.select-simulation").MySelect(‘getText‘)[1]);        alert($("div.select-simulation").MySelect(‘getText‘)[2]);    });

.select-simulation { position: relative; height: 25px; width: 177px; z-index: 1; display: inline-block; *display: block; *zoom: 1; *display: inline; font-size: 12px; color: 666; outline: none;vertical-align:middle; }.select-simulation .select-s-val { border: 1px solid #d0d2d9; *zoom: 1; position: relative; z-index: 5; top: 0px; left: 0px; *zoom: 1; }.select-simulation .select-s-val.focuss { border-color: #0094ff; }.select-simulation .select-s-val:hover { border-color: #0094ff; }.select-simulation .select-s-val:after { content: "clear"; height: 0px; display: block; overflow: 0px; visibility: hidden; clear: both; }.select-simulation .select-s-val .text-box { display: inline-block; width: 154px; border: none; height: 25px; background: #fff; filter: alpha(opacity=0); opacity: 0; position: absolute; left: 0px; top: 0px; z-index: 1; }.select-simulation .select-s-val input { width: 144px; float: left; outline: none; border: 0px; height: 25px; line-height: 20px;padding:0px; padding-left: 5px; }.select-simulation .select-s-val a { width: 25px; height: 25px; float: left; background: #fff; border-left: 1px solid #e2e2e2; cursor: default; }.select-simulation .select-s-val a i { display: block; width: 0px; height: 0px; border: 5px dashed transparent; border-top: 5px solid #888; overflow: hidden; float: left; margin: 10px 0px 0px 8px; _display: inline; }/*.select-simulation .select-s-val a:hover { background: #888; }        .select-simulation .select-s-val a:hover i { border-top-color: #ddd; }*/.select-simulation .select-s-a { position: absolute; top: 26px; left: 0px; width: 175px; border: 1px solid #e2e2e2; height: 175px; overflow: auto; display: none; z-index: 3;background:#fff; }.select-simulation .select-s-a a { display: block; height: 20px; text-align: left; text-indent: 5px; line-height: 20px; overflow: hidden; cursor: default; }.select-simulation .select-s-a a:hover { background: #2793fb; color: #fff; }

 <span>地    区：</span>            <span> 省：</span><div class="select-simulation"></div>            <span> 市：</span><div class="select-simulation"></div>            <span> 区/县：</span><div class="select-simulation"></div>