jQuery中国省市区地址三级联动插件Distpicker

以你之姓@ 2021-11-24 01:48 457阅读 0赞

demo案例：[http://www.jq22.com/demo/jQueryDistpicker20160621/][http_www.jq22.com_demo_jQueryDistpicker20160621]

官网文档：[http://www.jq22.com/jquery-info8054][http_www.jq22.com_jquery-info8054]

转载博客：[https://blog.csdn.net/CAO11021/article/details/81503050][https_blog.csdn.net_CAO11021_article_details_81503050]

根据项目样式需求更改插件的样式：

引入js：

var Province = $('#province1 option:selected').text();//省份
     var City = $('#city1 option:selected').text();//城市

JQ得到选中的城市：

var Province = $('#province1 option:selected').text();//省份
     var City = $('#city1 option:selected').text();//城市

JQ回填选中城市数据：

**使用该组件的js时选择器的名称需要与文档上一致，否则不起作用。若无特殊要求，只需与demo上写的一致即可实现。**

**编辑地址，省市区动态显示：**

**使用最简单的模板即可：**

<div data-toggle="distpicker">
    	<select class="distpicker-select" id="province"></select>
    	<select class="distpicker-select" id="city"></select>
    	<select class="distpicker-select" id="district"></select>
    </div>
    
    $("#province").val(data.content.province);
    $("#province").trigger("change");
    $("#city").val(data.content.city);
    $("#city").trigger("change");
    $("#district").val(data.content.region);
    $("#district").trigger("change");

[http_www.jq22.com_demo_jQueryDistpicker20160621]: http://www.jq22.com/demo/jQueryDistpicker20160621/
[http_www.jq22.com_jquery-info8054]: http://www.jq22.com/jquery-info8054
[https_blog.csdn.net_CAO11021_article_details_81503050]: https://blog.csdn.net/CAO11021/article/details/81503050