js select常用操作控制代码


Posted in Javascript onMarch 16, 2010

// 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;

Javascript 相关文章推荐
Firefox中autocomplete=&quot;off&quot; 设置不起作用Bug的解决方法
Mar 25 Javascript
浅谈Javascript面向对象编程
Nov 15 Javascript
js编码、解码函数介绍及其使用示例
Sep 05 Javascript
JS实现当前页居中分页效果的方法
Jun 18 Javascript
有关jquery与DOM节点操作方法和属性记录
Apr 15 Javascript
Google 地图叠加层实例讲解
Aug 06 Javascript
jQuery插入节点和移动节点用法示例(insertAfter、insertBefore方法)
Sep 08 Javascript
Javascript实现一个简单的输入关键字添加标签效果实例
Jun 01 Javascript
实例详解vue.js浅度监听和深度监听及watch用法
Aug 16 Javascript
详解webpack 最简打包结果分析
Feb 20 Javascript
vue-router两种模式区别及使用注意事项详解
Aug 01 Javascript
vue-cli 为项目设置别名的方法
Oct 15 Javascript
js实现的日期操作类DateTime函数代码
Mar 16 #Javascript
javascript json2 使用方法
Mar 16 #Javascript
jQuery 选择器理解
Mar 16 #Javascript
jQuery 学习入门篇附实例代码
Mar 16 #Javascript
Jquery Ajax学习实例4 向WebService发出请求,返回实体对象的异步调用
Mar 16 #Javascript
Jquery Ajax学习实例3 向WebService发出请求,调用方法返回数据
Mar 16 #Javascript
javascript 二维数组的实现与应用
Mar 16 #Javascript
You might like
业余方法DIY电子管FM收音机
2021/03/02 无线电
PHP中SESSION使用中的一点经验总结
2012/03/30 PHP
php实现的百度搜索某地天气的小偷代码
2014/04/23 PHP
php使用CURL伪造IP和来源实例详解
2015/01/15 PHP
jquery获取多个checkbox的值异步提交给php的方法
2015/06/24 PHP
PHP工程师VIM配置分享
2015/12/15 PHP
PhpStorm2020 + phpstudyV8 +XDebug的教程详解
2020/09/17 PHP
JavaScript 学习笔记(七)字符串的连接
2009/12/31 Javascript
javascript 中__proto__和prototype详解
2014/11/25 Javascript
详谈nodejs异步编程
2014/12/04 NodeJs
javascript算法题:求任意一个1-9位不重复的N位数在该组合中的大小排列序号
2015/04/01 Javascript
基本DOM节点操作
2017/01/17 Javascript
详解Angualr 组件间通信
2017/01/21 Javascript
关于jQuery EasyUI 中刷新Tab选项卡后一个页面变形的解决方法
2017/03/02 Javascript
微信小程序 监听手势滑动切换页面实例详解
2017/06/15 Javascript
jQuery validata插件实现方法
2017/06/25 jQuery
浅谈express 中间件机制及实现原理
2017/08/31 Javascript
使用 Node.js 开发资讯爬虫流程
2018/01/07 Javascript
关于jquery layui弹出层的使用方法
2018/04/21 jQuery
JS基于对象的链表实现与使用方法示例
2019/01/31 Javascript
js实现消灭星星(web简易版)
2020/03/24 Javascript
Vue列表如何实现滚动到指定位置样式改变效果
2020/05/09 Javascript
解决父组件将子组件作为弹窗调用只执行一次created的问题
2020/07/24 Javascript
[02:44]重置世界,颠覆未来——DOTA2 7.23版本震撼上线
2019/12/01 DOTA
Python NumPy库安装使用笔记
2015/05/18 Python
详解tensorflow实现迁移学习实例
2018/02/10 Python
PyCharm代码回滚,恢复历史版本的解决方法
2018/10/22 Python
原来我一直安装 Python 库的姿势都不对呀
2019/11/11 Python
Python实现井字棋小游戏
2020/03/09 Python
Python greenlet和gevent使用代码示例解析
2020/04/01 Python
新春寄语大全
2014/04/09 职场文书
演讲稿格式范文
2014/05/19 职场文书
国庆节演讲稿范文2014
2014/09/19 职场文书
2014五年级班主任工作总结
2014/12/05 职场文书
大学生心理健康教育心得体会
2016/01/12 职场文书
使用Java去实现超市会员管理系统
2022/03/18 Java/Android