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 相关文章推荐
fireworks菜单生成器mm_menu.js在 IE 7.0 显示问题的解决方法
Oct 20 Javascript
jquery选择器的选择使用及性能介绍
Jan 16 Javascript
jquery事件与函数的使用介绍
Sep 29 Javascript
Javascript基础教程之数据类型 (字符串 String)
Jan 18 Javascript
jQuery实现平滑滚动的标签分栏切换效果
Aug 28 Javascript
JS定义类的六种方式详解
May 12 Javascript
jQuery实现的省市县三级联动菜单效果完整实例
Aug 01 Javascript
JS日程管理插件FullCalendar简单实例
Feb 07 Javascript
JavaScript实现的弹出遮罩层特效经典示例【基于jQuery】
Jul 10 jQuery
websocket4.0+typescript 实现热更新的方法
Aug 14 Javascript
在vue中根据光标的显示与消失实现下拉列表
Sep 29 Javascript
微信小程序批量监听输入框对按钮样式进行控制的实现代码
Oct 12 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
vBulletin Forum 2.3.xx SQL Injection
2006/10/09 PHP
PHP调用Linux的命令行执行文件压缩命令
2013/01/27 PHP
php防止sql注入示例分析和几种常见攻击正则表达式
2014/01/12 PHP
PHP常用数组函数介绍
2014/07/28 PHP
ajaxControlToolkit AutoCompleteExtender的用法
2008/10/30 Javascript
zShowBox 图片放大展示jquery版 兼容性
2011/09/24 Javascript
javascript返回顶部效果(自写代码)
2013/01/06 Javascript
js前台分页显示后端JAVA数据响应
2013/03/18 Javascript
js页面跳转的问题(跳转到父页面、最外层页面、本页面)
2013/08/14 Javascript
jQuery判断数组是否包含了指定的元素
2015/03/10 Javascript
基于jQuery实现仿51job城市选择功能实例代码
2016/03/02 Javascript
BootStrap 智能表单实战系列(二)BootStrap支持的类型简介
2016/06/13 Javascript
jQuery多个版本和其他js库冲突的解决方法
2016/08/11 Javascript
js数组与字符串常用方法总结
2017/01/13 Javascript
CSS3+JavaScript实现翻页幻灯片效果
2017/06/28 Javascript
JS原生带小白点轮播图实例讲解
2017/07/22 Javascript
vue-cli项目中怎么使用mock数据
2017/09/27 Javascript
微信小程序实现美团菜单
2018/06/06 Javascript
bootstrap table列和表头对不齐的解决方法
2019/07/19 Javascript
Vue + Element UI图片上传控件使用详解
2019/08/20 Javascript
js实现纯前端压缩图片
2020/11/16 Javascript
如何在VUE中使用vue-awesome-swiper
2021/01/04 Vue.js
零基础写python爬虫之urllib2使用指南
2014/11/05 Python
python如何实现远程控制电脑(结合微信)
2015/12/21 Python
TensorFlow实现MLP多层感知机模型
2018/03/09 Python
如何优雅地处理Django中的favicon.ico图标详解
2018/07/05 Python
PyCharm最新激活码PyCharm2020.2.3有效
2020/11/18 Python
Django中template for如何使用方法
2021/01/31 Python
CSS3 边框效果
2019/11/04 HTML / CSS
Pretty Little Thing爱尔兰:时尚女性服饰
2017/03/27 全球购物
微软中国官方商城:Microsoft Store中国
2018/10/12 全球购物
Theo + George官方网站:都柏林时尚品牌
2019/04/08 全球购物
校园安全广播稿
2014/02/08 职场文书
大学生找工作求职信
2014/07/09 职场文书
2015年度党员自我评价范文
2015/03/03 职场文书
Pyhton模块和包相关知识总结
2021/05/12 Python