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 相关文章推荐
List the Codec Files on a Computer
Jun 11 Javascript
javascript在一段文字中的光标处插入其他文字
Aug 26 Javascript
Ext grid 添加右击菜单
Nov 26 Javascript
js,jQuery 排序的实现代码,网页标签排序的实现,标签排序
Apr 27 Javascript
Table冻结表头示例代码
Aug 20 Javascript
js调用css属性写法
Sep 21 Javascript
学习JavaScript设计模式(策略模式)
Nov 26 Javascript
angularjs实现首页轮播图效果
Apr 14 Javascript
JS中跳出循环的示例代码
Sep 14 Javascript
js数组去重的N种方法(小结)
Jun 07 Javascript
JavaScript实现的九种排序算法
Mar 04 Javascript
Element-UI 使用el-row 分栏布局的教程
Oct 26 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开发框架的对比
2013/07/05 PHP
php中数字0和空值的区别分析
2014/06/05 PHP
PHP精确计算功能示例
2016/11/29 PHP
用js怎么把&amp;字符换成&quot;&amp;amp:&quot;
2006/10/19 Javascript
IE无法设置短域名下Cookie
2010/09/23 Javascript
js渐变显示渐变消失示例代码
2013/08/01 Javascript
JavaScript模拟实现继承的方法
2015/03/30 Javascript
javascript背景时钟实现方法
2015/06/18 Javascript
jQuery实现带滚动导航效果的全屏滚动相册实例
2015/06/19 Javascript
两种js监听滚轮事件的实现方法
2016/05/13 Javascript
BootStrap 智能表单实战系列(二)BootStrap支持的类型简介
2016/06/13 Javascript
浅谈JS的基础类型与引用类型
2016/09/13 Javascript
解读ES6中class关键字
2017/11/20 Javascript
详解Vue.js v-for不支持IE9的解决方法
2018/12/29 Javascript
Vue使用watch监听一个对象中的属性的实现方法
2019/05/10 Javascript
基于vue的tab-list类目切换商品列表组件的示例代码
2020/02/14 Javascript
[01:11:27]2018DOTA2亚洲邀请赛小组赛 A组加赛 Newbee vs Optic
2018/04/03 DOTA
使用pycharm在本地开发并实时同步到服务器
2019/08/02 Python
python文字转语音实现过程解析
2019/11/12 Python
Python中用pyinstaller打包时的图标问题及解决方法
2020/02/17 Python
python实现IOU计算案例
2020/04/12 Python
python两种获取剪贴板内容的方法
2020/11/06 Python
使用CSS3代码绘制可爱的Hello Kitty猫
2016/08/03 HTML / CSS
CSS3中border-radius属性设定圆角的使用技巧
2016/05/10 HTML / CSS
HTML5 video视频字幕的使用和制作方法
2018/05/03 HTML / CSS
Html5定位终极解决方案
2020/02/05 HTML / CSS
Electrolux伊莱克斯巴西商店:家用电器、小家电和配件
2018/05/23 全球购物
世界上最大的艺术和工艺用品商店:MisterArt.com
2018/07/13 全球购物
面向中国市场的在线海淘美妆零售网站:Beauty House美丽屋
2021/03/02 全球购物
拓展培训心得体会
2014/01/04 职场文书
应聘编辑职位自荐信范文
2014/01/05 职场文书
不打扫卫生检讨书
2014/02/12 职场文书
雏鹰争章活动总结
2014/05/09 职场文书
入党积极分子批评与自我批评思想汇报
2014/09/14 职场文书
当幸福来敲门英文观后感
2015/06/01 职场文书
2016年教师政治思想表现评语
2015/12/02 职场文书