jQuery WeUI 地址选择器的使用

界面:

       <div class="weui-cell">
                    <div class="weui-cell__hd"><label class="weui-label">所在地:</label></div>
                    <div class="weui-cell__bd">
                        <input id="start" class="weui-input" type="text" placeholder="请选择车辆所在地" onchange="setStart()">
                        <input name="SitePId" type="hidden" id="start_place_id" value="@Model.SiteCity">
                    </div>
                </div>

引用:

  <link href="~/Content/jqueryweui/weui.min.css" rel="stylesheet" />
    <link href="~/Content/jqueryweui/jquery-weui.min.css" rel="stylesheet" />

    <script type="text/javascript" src="~/Content/jqueryweui/jquery.min.js"></script>
    <script type="text/javascript" src="~/Content/jqueryweui/jquery-weui.min.js"></script>
    <script type="text/javascript" src="~/Content/jqueryweui/city-picker.js"></script>

js部分:

<script type="text/javascript">
    //初始化地址选择器
	$("#start").cityPicker({
	    title: "选择目的地",
	    showDistrict: false
	});

	 $(function () {

	     loadStart();
	 })
//用存储的地址code值去匹配当前地址
	function loadStart() {
	    if ($("#start_place_id").val() != "") {
	        $("#start").attr("data-code", $("#start_place_id").val());
	        var citydatacodes = $("#start_place_id").val();
	             var str = citydatacodes.substring(2);
	             $("#start").attr("data-codes", citydatacodes.replace(str, "0000") + "," + $("#start_place_id").val());
	             //加载已认证的默认城市
	             var cityvalue = [];
	             var codes = $("#start").attr("data-code");   //如130100
	             var str = codes.replace(codes.substring(2), "0000"); //如130000
	             var raw = $.rawCitiesData;
	             for (var i = 0; i < raw.length; i++) {
	                 if (str == raw[i].code) {
	                     cityvalue.push(raw[i].name);
	                     console.log(raw[i].name);
	                     for (var j = 0; j < raw[i].sub.length; j++) {
	                         if (raw[i].sub[j].code === codes) {
	                             console.log(raw[i].sub[j].name);
	                             cityvalue.push(raw[i].sub[j].name);
	                             console.log(cityvalue);
	                             $("#start").val(cityvalue);
	                             return;
	                             // sub(raw[i].sub[j].name);
	                         }
	                     }
	                 }
	             }
	         }
	     }


//获取code值
function setStart() {
	 var codes = $("#start").attr("data-code");
	  $("#start_place_id").val(codes);
 }
</script>

  

posted @ 2017-10-10 10:02  柠檬青味  阅读(6979)  评论(2编辑  收藏  举报