JQuery 对 Select option 的操作

Select 笔记

$(document).ready(function() {
  //绑定下拉框change事件，当下来框改变时调用 SelectChange()方法
  $("#select").change(function() {
    SelectChange();
  });
})

function SelectChange() {
  //获取下拉框选中项的text属性值
  var selectText = $("#select").find("option:selected").text();

  //获取下拉框选中项的value属性值
  var selectValue = $("#select").val();

  //获取下拉框选中项的index属性值
  var selectIndex = $("#select").get(0).selectedIndex;

  获取下拉框最大的index属性值
  var selectMaxIndex = $("#select option:last").attr("index");
}

function selectByIndex(index) {
  //根据index 选中
  $("#select").get(0).selectedIndex = index;
}

function selectByValue(value) {
  //根据value 选中
  $("#select").val(value);
}

function selectByText(text) {
  //根据text 选址
  $("#select option[text='"+text+"']").attr("selected", "selected");

  $("#select option:contains('"+text+"')").attr("selected", true);
}

function selectAppend() {
  //在下拉框最后添加一个选项
  $("#select").append("<option value='add'>add</option>");
}

function selectPrepend() {
  //在下拉框最前添加一个选项
  $("#select").prepend("<option value='0'>0</option>")
}

function selectRemove() {
  //移除下拉框最后一个选项
  $("#select option:last").remove();
}

function selectRemoveByIndex(index) {
  //根据index 移除
  $("#select option[index='"+index+"']").remove();
}

function selectRemoveByValue(value) {
  //根据value 移除
  $("#select option[value='"+value+"']").remove();
}

function selectRemoveByText(text) {
  //根据text移除
  $("#select option[text='"+text+"']").remove();
}
复制代码

转载于:https://juejin.im/post/5a585929f265da3e261be593