jquery.cityselect.js城市插件

 引用：

<script src="js/jquery-2.1.1.min.js"></script>

<script src="js/jquery.cityselectnew.js"></script>

html:

    <div class="citySelect"> 
        <select class="prov"></select>  
        <select class="city" disabled="disabled"></select> 
        <select class="dist" disabled="disabled"></select>
    </div> 

 <button id="tijiaoBtn">提交</button>

js:

   var prov="吉林";var city="长春";var dist="南关区";
    $(".citySelect").citySelect({
       prov:prov, //省份     --赋值
       city:city, //城市      --赋值
       dist:dist,  //县区     --赋值
       nodata:"none",
      //<!--      required:false -->
  }); 
    

    //  取值
    $("#tijiaoBtn").on("click",function(){
      console.log(this);
      console.log($(".prov").val(),$(".city").val(),$(".dist").val());
    });

jquery.cityselect.js城市插件

1、好处：

容易实现城市联动效果。

2、缺点：

该插件的样式使用的selecet标签，在设置样式的比较麻烦，发现很难设置为自己项目中使用的样式。

虽然项目中因为样式、动态数据效果等原因最后也没有用到该插件，但是jquery.cityselect.js插件还是非常不错的插件。

注：该插件引用城市信息url:"city.min.js",该地址要设置正确，否则查找不到城市信息。这里可以将“city.min.js”内容直接拷到url中，“jquery.cityselect.js”中有当url为字符串信息时的设置。