html中如何实现省市

是省市联动选择？写个简单的案例给你看看，使用请载入jquery文件，效果如图：

html如下：

<select id="province">

  <option>请选择省份</option>

  <option>北京</option>

  <option>上海</option>

  <option>江苏</option>

</select>

<select class="city">

  <option>请选择城市</option>

</select>

<select class="city">

  <option>东城</option>

  <option>西城</option>

  <option>崇文</option>

  <option>宣武</option>

  <option>朝阳</option>

</select>

<select class="city">

  <option>黄浦</option>

  <option>卢湾</option>

  <option>徐汇</option>

  <option>长宁</option>

  <option>静安</option>

</select>

<select class="city">

  <option>南京</option>

  <option>镇江</option>

  <option>苏州</option>

  <option>南通</option>

  <option>扬州</option>

</select>

jquery如下：

var currentShowCity=0

$(document).ready(function(){

  $("#province").change(function(){

    $("#province option").each(function(i,o){

      if($(this).attr("selected"))

      {

        $(".city").hide()

        $(".city").eq(i).show()

        currentShowCity=i

      }

    })

  })

  $("#province").change()

})

function getSelectValue(){

  alert("1级="+$("#province").val())

  $(".city").each(function(i,o){

    if(i == currentShowCity){

      alert("2级="+$(".city").eq(i).val())

    }

  })

}

第一种，微信自带的省市区数据

第二种，根据省id,ciiyid联动

js

第三种,数据一次性返回，如下

直接复制可用

利用vant(后台返回的所有数据)

如果w-vant需要做成联动的话；一级一级的请求回来再处理数据就可以了

你这 是通过 后台取数据的，关改 上面的代码是没有用的，省市联动一般有两种做法。第一种，下载一个js的省 市联动的插件，调用插件就可以，第二种，就是存在数据库里，然后前端当省框的值改变 的时候就ajax去后台取出该省的所有市在市框中列出来，然后再市框的值改变的时候，再后台去取出该市所有的县区在前端列出来。现在大部份是用第一种做法比较好，下个插件吧

---