jQuery动态添加删除select项(实现代码)

  

复制代码 代码如下:

  // 添加

  function col_add() {

  var selObj = $("#mySelect");

  var value="value";

  var text="text";

  selObj.append("<option value='"+value+"'>"+text+"</option>");

  }

  // 删除

  function col_delete() {

  var selOpt = $("#mySelect option:selected");

  selOpt.remove();

  }

  // 清空

  function col_clear() {

  var selOpt = $("#mySelect option");

  selOpt.remove();

  }

  以上方法为jQuery动态添加、删除和清空select。下面是纯js的写法:

  

复制代码 代码如下:

  var sid = document.getElementById("mySelect");

  sid.options[sid.options.length]=new Option("text","value");   // 在select最后添加一项

  其他常用的方法:

  

复制代码 代码如下:

  $("#mySelect").change(function(){//code...});    //select选中项改变时触发

  // 获取select值

  var text=$("#mySelect").find("option:selected").text();   //获取Select选中项的Text

  var value=$("#mySelect").val();   //获取Select选中项的Value

  var value=$("#mySelect option:selected").attr("value");   //获取Select选中项的Value

  var index=$("#mySelect").get(0).selectedIndex;   //获取Select选中项的索引值,从0开始

  var index=$("#mySelect option:selected").attr("index");   //不可用!!!

  var index=$("#mySelect option:selected").index();   //获取Select选中项的索引值,从0开始

  var maxIndex=$("#mySelect option:last").attr("index");   //不可用!!!

  var maxIndex=$("#mySelect option:last").index();//获取Select最大索引值,从0开始

  $("#mySelect").prepend("<option value='value'>text</option>");   //Select第一项前插入一项

  // 设置select值

  //根据索引设置选中项

  $("#mySelect").get(0).selectedIndex=index;//index为索引值

  //根据value设置选中项

  $("#mySelect").attr("value","newValue");

  $("#mySelect").val("newValue");

  $("#mySelect").get(0).value = value;

  //根据text设置对应的项为选中项

  var count=$("#mySelect option").length;

  for(var i=0;i<count;i++)

  {

  if($("#mySelect").get(0).options[i].text == text)

  {

  $("#mySelect").get(0).options[i].selected = true;

  break;

  }

  }

  // 清空select

  $("#mySelect").empty();