关于jQuery的city-picker插件的使用

首先明确city-picker插件的使用方式有两种：HTML代码方式、JS代码方式。

不管使用哪种方式，首先我们要导入jquery.js、city-picker.css、city-picker.data.js、city-picker.js文件。

然后，我们直接上代码查看HTML方式创建组件。

<div style="position: relative;">
  <input name="sendAreaInfo" readonly type="text" data-toggle="city-picker">
</div>

使用js代码创建组件

<div style="position: relative;">
  <input id="city-picker1" readonly type="text">
  <input type="button" id="reset" value="重置">
  <input type="button" id="init" value="初始化">
  <script type="text/javascript">
  	$("#city-picker1").citypicker();
  	$("#reset").click(function(){
  		//将citypicker插件清空
  		$("#city-picker1").citypicker("reset");
  	})
  	$("#init").click(function(){
  		//将citypicker插件清空
  		$("#city-picker1").citypicker("reset");
  		$("#city-picker1").citypicker("destroy");
  		$("#city-picker1").citypicker({
  			province:"北京市",
  			city:"北京市",
  			district:"朝阳区"
  		});
  	})
  </script>