jQuery中下拉框select的操作方法详解
最近在写页面的时候常常遇到要动态增删改下拉框select的情况,由于我比较习惯用jquery框架来架构我的前端js,所以就顺便把各种jquery操作下拉框select的方法总结了一下,收藏起来以便下次用到的时候拿出来翻翻,当然也把这些分享给大家,或许收藏它会给你今后写jquery带来方便。
1、jquery获取当前选中select的text值
var
checkText=$(
"#slc1"
).find(
"option:selected"
).text();
2、jquery获取当前选中select的value值
var
checkValue=$(
"#slc1"
).val();
3、jquery获取当前选中select的索引值
var
index=$(
"#slc1 "
).get(0).selectedIndex;
4、jquery获取指定select的最大索引值
var
maxIndex=$(
"#slc1 option:last"
).attr(
"index"
);
5、jquery设置索引值为1的项为当前选中项
$(
"#slc1 "
).get(0).selectedIndex=1;
6、jquery设置value值2的项为当前选中项
$(
"#slc1 "
).val(2);
7、jquery设置text值为"青藤园"的项为当前选中项
$(
"#slc1 option[text='青园w']"
).attr(
"selected"
,
true
);
8、为指定select下拉框追加一个option(追加到在末尾)
$(
"#slc2"
).append(
""
+i+
""
);
9、为制定select下拉框插入一个option(插入到第一个位置)
$(
"#slc2"
).prepend(
"请选择"
);
10、jquery删除select下拉框的最后一个option
$(
"#slc2 option:last"
).remove();
11、jquery删除select下拉框索引值为0的option
$(
"#slc2 option[index='0']"
).remove();
12、jquery删除select下拉框value为2的option
$(
"#slc2 option[value='2']"
).remove();
13、jquery删除select下拉框text为“青藤园”的option
$(
"#slc2 option[text='ewew2']"
).remove();
好了,差不多用的比较多也就这些,其他的可以根据以上的例子进行举一反三,需要的同学就收藏了吧,以后可以为你节省很多时间的那!