jquery实现省市select下拉框的替换(示例代码)

  省市对应的实现:<还有一些没封装起来>

  更具选择的省份来确定市的内容

  jsp代码:

  

复制代码 代码如下:

  <body>

  省份<select name="prin">

  <option>--请选择--</option>

  <option>福建</option>

  <option>北京</option>

  <option>山东</option>

  <option>上海</option>

  </select>

  县、市<select  id="sel2">

  <option>--请选择--</option>

  </select>

  </body>

  js代码:

  

复制代码 代码如下:

  function appendShi(shi) {//字符串拼接,拼接市区

  var fjs='';

  for(var i=0;i<shi.length;i++)

  {

  fjs += '<option>' + shi[i]+ '</option>';

  }

  return fjs;

  }

  $(function() {

  var prince = ['福建','北京','山东','上海'];

  var fjs = ['厦门','泉州','福州'];

  var bjs = ['北京','朝阳区','海淀区','平谷区'];

  var shs = ['黄浦区','长宁区','宝山区','嘉定区'];

  var sds = ['济南','青岛','烟台','日照','莱芜','sss'];

  $("select[name='prin']").change(function() {

  var shi = $("#sel2");//得到第二个select

  var prin = $("select[name='prin'][select option:selected]");//得到选中的身份的值

  var newShiSel = $('<select id="sel2"><option>--请选择--</option></select>');//

  if (prin.val() == '福建'){

  newShiSel.append(appendShi(fjs));

  }

  if (prin.val() == '北京') {

  newShiSel.append(appendShi(bjs));

  }

  if (prin.val() == '上海') {

  newShiSel.append(appendShi(shs));

  }

  if (prin.val() == '山东') {

  newShiSel.append(appendShi(sds));

  }

  shi.replaceWith(newShiSel);

  });

  });