博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Javascript 操作select控件大全(新增、修改、删除、选中、清空、判断存在等)...
阅读量:4952 次
发布时间:2019-06-11

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

 1
判断select选项中 是否存在Value="paraValue"的Item 
 2
向select选项中 加入一个Item 
 3
从select选项中 删除一个Item 
 4
删除select中选中的项 
 5
修改select选项中 value="paraValue"的text为"paraText" 
 6
设置select中text="paraText"的第一个Item为选中 
 7
设置select中value="paraValue"的Item为选中 
 8
得到select的当前选中项的value 
 9
得到select的当前选中项的text 
10
得到select的当前选中项的Index 
11
清空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/lr-ting/archive/2013/04/10/3012042.html

你可能感兴趣的文章
fegin 调用源码分析
查看>>
Linux的基本命令
查看>>
02号团队-团队任务3:每日立会(2018-12-05)
查看>>
sql 语法大全
查看>>
SQLite移植手记1
查看>>
Java AmericanFlagSort
查看>>
Mysql远程连接报错
查看>>
C# windows程序应用与JavaScript 程序交互实现例子
查看>>
sqlServer去除字段中的中文
查看>>
HashMap详解
查看>>
Adobe Scout 入门
查看>>
51nod 1247可能的路径
查看>>
js05-DOM对象二
查看>>
mariadb BINLOG_FORMAT = STATEMENT 异常
查看>>
C3P0 WARN: Establishing SSL connection without server's identity verification is not recommended
查看>>
iPhone在日本最牛,在中国输得最慘
查看>>
动态方法决议 和 消息转发
查看>>
WPF自定义搜索框代码分享
查看>>
js 基础拓展
查看>>
SpringBoot访问html访问不了的问题
查看>>