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 相关文章推荐
javascript 变量作用域 代码分析
Jun 26 Javascript
js focus不起作用的解决方法(主要是因为dom元素是否加载完成)
Nov 05 Javascript
JavaScript通过事件代理高亮显示表格行的方法
May 27 Javascript
javascript对象的相关操作小结
May 16 Javascript
JS前端笔试题分析
Dec 19 Javascript
JS定时检测任务任务完成后执行下一步的解决办法
Dec 22 Javascript
微信小程序movable view移动图片和双指缩放实例代码
Aug 08 Javascript
vue中的模态对话框组件实现过程
May 01 Javascript
浅谈Vuex注入Vue生命周期的过程
May 20 Javascript
layui 富文本编辑器和textarea值的相互传递方法
Sep 18 Javascript
vue 返回上一页,页面样式错乱的解决
Nov 14 Javascript
Openlayers+EasyUI Tree动态实现图层控制
Sep 28 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
PHP随机数生成代码与使用实例分析
2011/04/08 PHP
php中explode函数用法分析
2014/11/15 PHP
PHP实现PDO的mysql数据库操作类
2014/12/12 PHP
PHP实现一个简单url路由功能实例
2016/11/05 PHP
Swoole4.4协程抢占式调度器详解
2019/05/23 PHP
PHP多进程简单实例小结
2019/11/09 PHP
jQuery 学习第七课 扩展jQuery的功能 插件开发
2010/05/17 Javascript
SharePoint 客户端对象模型 (一) ECMA Script
2011/05/22 Javascript
jquery默认校验规则整理
2014/03/24 Javascript
jquery简单的弹出层浮动层代码
2015/04/27 Javascript
JavaScript学习小结之使用canvas画“哆啦A梦”时钟
2016/07/24 Javascript
ajax分页效果(bootstrap模态框)
2017/01/23 Javascript
Bootstrap实现的标签页内容切换显示效果示例
2017/05/25 Javascript
canvas基础绘制-绚丽倒计时的实例
2017/09/17 Javascript
微信小程序实现图片上传、删除和预览功能的方法
2017/12/18 Javascript
JS实现简单获取最近7天和最近3天日期的方法
2018/04/18 Javascript
基于elementUI使用v-model实现经纬度输入的vue组件
2019/05/12 Javascript
Node.js从字符串生成文件流的实现方法
2019/08/18 Javascript
详解用async/await来处理异步
2019/08/28 Javascript
2019年度web前端面试题总结(主要为Vue面试题)
2020/01/12 Javascript
在Vue中获取自定义属性方法:data-id的实例
2020/09/09 Javascript
Python字典简介以及用法详解
2016/11/15 Python
Python内置random模块生成随机数的方法
2019/05/31 Python
最新PyCharm从安装到PyCharm永久激活再到PyCharm官方中文汉化详细教程
2020/11/17 Python
python mongo 向数据中的数组类型新增数据操作
2020/12/05 Python
智能电子秤、手表和健康监测仪:Withings(之前为诺基亚健康)
2018/10/30 全球购物
泰国排名第一的家居用品中心:HomePro
2020/11/18 全球购物
如何获得EntityManager
2014/02/09 面试题
法院干警四风问题自我剖析材料
2014/09/29 职场文书
世界遗产的导游词
2015/02/13 职场文书
2015年建党94周年演讲稿
2015/03/19 职场文书
2015年林业工作总结
2015/05/14 职场文书
感恩主题班会教案
2015/08/12 职场文书
2016中秋节晚会开场白
2015/11/26 职场文书
导游词之黄果树瀑布
2019/09/20 职场文书
python使用matplotlib绘制图片时x轴的刻度处理
2021/08/30 Python