博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Js操作Select大全
阅读量:4873 次
发布时间:2019-06-11

本文共 3693 字,大约阅读时间需要 12 分钟。

判断select选项中 是否存在Value="paraValue"的Item 

向select选项中 加入一个Item 
从select选项中 删除一个Item 
删除select中选中的项 
修改select选项中 value="paraValue"的text为"paraText" 
设置select中text="paraText"的第一个Item为选中 
设置select中value="paraValue"的Item为选中 
得到select的当前选中项的value 
得到select的当前选中项的text 
得到select的当前选中项的Index 
清空select的项 
js代码:

// 1.判断select选项中 是否存在Value="paraValue"的Item        function jsSelectIsExitItem(objSelect, objItemValue) {            var isExit = false;            for (var i = 0; i < objSelect.options.length; i++) {                if (objSelect.options[i].value == objItemValue) {                    isExit = true;                    break;                }            }            return isExit;        }            // 2.向select选项中 加入一个Item        function jsAddItemToSelect(objSelect, objItemText, objItemValue) {            //判断是否存在            if (jsSelectIsExitItem(objSelect, objItemValue)) {                alert("该Item的Value值已经存在");            } else {                var varItem = new Option(objItemText, objItemValue);              objSelect.options.add(varItem);             alert("成功加入");         }        }           // 3.从select选项中 删除一个Item        function jsRemoveItemFromSelect(objSelect, objItemValue) {            //判断是否存在            if (jsSelectIsExitItem(objSelect, objItemValue)) {                for (var i = 0; i < objSelect.options.length; i++) {                    if (objSelect.options[i].value == objItemValue) {                        objSelect.options.remove(i);                        break;                    }                }                alert("成功删除");            } else {                alert("该select中 不存在该项");            }        }         // 4.删除select中选中的项    function jsRemoveSelectedItemFromSelect(objSelect) {            var length = objSelect.options.length - 1;        for(var i = length; i >= 0; i--){            if(objSelect[i].selected == true){                objSelect.options[i] = null;            }        }    }         // 5.修改select选项中 value="paraValue"的text为"paraText"        function jsUpdateItemToSelect(objSelect, objItemText, objItemValue) {            //判断是否存在            if (jsSelectIsExitItem(objSelect, objItemValue)) {                for (var i = 0; i < objSelect.options.length; i++) {                    if (objSelect.options[i].value == objItemValue) {                        objSelect.options[i].text = objItemText;                        break;                    }                }                alert("成功修改");            } else {                alert("该select中 不存在该项");            }        }           // 6.设置select中text="paraText"的第一个Item为选中        function jsSelectItemByValue(objSelect, objItemText) {                //判断是否存在            var isExit = false;            for (var i = 0; i < objSelect.options.length; i++) {                if (objSelect.options[i].text == objItemText) {                    objSelect.options[i].selected = true;                    isExit = true;                    break;                }            }                  //Show出结果            if (isExit) {                alert("成功选中");            } else {                alert("该select中 不存在该项");            }        }           // 7.设置select中value="paraValue"的Item为选中    document.all.objSelect.value = objItemValue;           // 8.得到select的当前选中项的value    var currSelectValue = document.all.objSelect.value;           // 9.得到select的当前选中项的text    var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text;           // 10.得到select的当前选中项的Index    var currSelectIndex = document.all.objSelect.selectedIndex;           // 11.清空select的项    document.all.objSelect.options.length = 0;

 

转载于:https://www.cnblogs.com/dreammyle/p/3927762.html

你可能感兴趣的文章
hdu 3046 Pleasant sheep and big big wolf 最小割
查看>>
org.apache.catalina.startup.Catalina异常处理
查看>>
Java-IO Stream
查看>>
pagehelper的实现原理
查看>>
JAVA-序列化深拷贝对象
查看>>
input的placeholder的颜色、字号、边距设置
查看>>
B1029 旧键盘 (20 分)
查看>>
理解粒子滤波(particle filter)
查看>>
1-6-04:数组逆序重放
查看>>
PHP之文件目录基础操作方法
查看>>
POJ 2251 Dungeon Master(3D迷宫 bfs)
查看>>
问题 B: 习题6-5 数组元素逆置
查看>>
Xenomai 3 migration
查看>>
windows下apache httpd2.4.26集群完整搭建例子:下载、启动、tomcat集群例子
查看>>
Android应用资源---绘制资源类型(Drawable)(四)
查看>>
bzoj 2155 Xor
查看>>
git 设定全局ignore
查看>>
Rails5 layout 和 template
查看>>
Codeforces Round #460 Div. 2 C.D
查看>>
CodeForces 1110H. Modest Substrings
查看>>