日期:2014-05-19  浏览次数:20616 次

一个关于<select>标签的问题
$('#cityName').click(function() {
 
  $.ajax({
  url: "getCity.do",
  dataType: 'json', //返回的类型为json
  success: function(data) { //成功时执行的方法
   
  $("#cityName").empty(); //清空下拉列表
  $(data.rows).each(function(i, item){
   
  $("#cityName").append($("<option value='" + item.id + "'>" + item.name + "</option>"));
  });

  }
  });
  });

JS代码如上,动态生成一个下拉框,下拉框里的数据能正常显示,现在的问题是只能选择下拉框里的第一项,选第二项以下的下拉框里的值就会瞬间变成第一项,麻烦问下各位这是什么情况。

------解决方案--------------------
你注册是click实践 每次点击的时候 当然都会重新初始化这个下拉框了,所以最后就会选择这个下拉框 ,你可以变成onchang
------解决方案--------------------
是的,你为下拉框注册了click事件.每次单击都会通过ajax提交后台,重新描画option
------解决方案--------------------
下拉列表要注册onchange事件。
------解决方案--------------------

这个代码应该是单击(其实你选第二项的时候也有单击)的时候就触发,这样你选任何一个它都会重新的发请求,包括每一个,只不过和原来一样你看不出来。你最好在单击后先判断一下,这个下拉框的选项是不是0,如果0表示没初始化,再进行json.
JScript code

$('#cityName').click(function() {
if ($('#cityName').options.length>0) return;
 
  $.ajax({
  url: "getCity.do",
  dataType: 'json', //返回的类型为json
  success: function(data) { //成功时执行的方法
   
  $("#cityName").empty(); //清空下拉列表
  $(data.rows).each(function(i, item){
   
  $("#cityName").append($("<option value='" + item.id + "'>" + item.name + "</option>"));
  });

  }
  });
  });

------解决方案--------------------
想问下 $("#cityName").append($("<option value='" + item.id + "'>" + item.name + "</option>")); 这句中 $("<option value='" + item.id + "'>" + item.name + "</option>") 为什么要用$()把option给括起来

直接写成

$("#cityName").append("<option value='" + item.id + "'>" + item.name + "</option>") 不成吗??
注:本人初始化省市联动时 是用的这种。