js 操作select相关方法函数


Posted in Javascript onDecember 06, 2009
1.判断select选项中 是否存在value="paravalue"的item
2.向select选项中 加入一个item
3.从select选项中 删除一个item
4.修改select选项中 value="paravalue"的text为"paratext"
5.设置select中text="paratext"的第一个item为选中
6.设置select中value="paravalue"的item为选中
7.得到select的当前选中项的value
8.得到select的当前选中项的text
9.得到select的当前选中项的index
10.清空select的项
-------------------------------------------
//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[objselect.options.length] = varitem;
  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选项中 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中 不存在该项");
    }    
}//5.设置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中 不存在该项");
    }    
}
//6.设置select中value="paravalue"的item为选中
//document.all.objselect.value = objitemvalue;
//7.得到select的当前选中项的value
//var currselectvalue = document.all.objselect.value;
//8.得到select的当前选中项的text
//var currselecttext = document.all.objselect.options[document.all.objselect.selectedindex].text;
//9.得到select的当前选中项的index
//var currselectindex = document.all.objselect.selectedindex;
//10.清空select的项
// document.all.objselect.options.length = 0;
具体的实例可以查看js select多选列表传值代码
https://3water.com/article/21270.htm
Javascript 相关文章推荐
TopList标签和JavaScript结合两例
Aug 12 Javascript
理解Javascript_12_执行模型浅析
Oct 18 Javascript
深入探讨前端框架react
Dec 09 Javascript
基于jQuery实现仿搜狐辩论投票动画代码(附源码下载)
Feb 18 Javascript
javascript的几种继承方法介绍
Mar 22 Javascript
浅谈jQuery中的eq()与DOM中element.[]的区别
Oct 28 Javascript
AngularJS自定义控件实例详解
Dec 13 Javascript
详解Angular 4.x NgIf 的用法
May 22 Javascript
vue 里面使用axios 和封装的示例代码
Sep 01 Javascript
swiper移动端轮播插件(触碰图片之后停止轮播)
Dec 28 Javascript
微信小程序图片轮播组件gallery slider使用方法详解
Jan 31 Javascript
微信小程序 MinUI组件库系列之badge徽章组件示例
Aug 20 Javascript
JavaScript 对象模型 执行模型
Dec 06 #Javascript
ASP Json Parser修正版
Dec 06 #Javascript
jquery ready函数源代码研究
Dec 06 #Javascript
javascript 模拟JQuery的Ready方法实现并出现的问题
Dec 06 #Javascript
javascript 动态生成私有变量访问器
Dec 06 #Javascript
JavaScript 加号(+)运算符号
Dec 06 #Javascript
javascript Demo模态窗口
Dec 06 #Javascript
You might like
PHP 上传文件大小限制
2009/07/05 PHP
PHP htmlentities()函数用法讲解
2019/02/25 PHP
yii2.0框架使用 beforeAction 防非法登陆的方法分析
2019/09/11 PHP
jquery ajax提交表单数据的两种实现方法
2010/04/29 Javascript
JQuery 1.3.2以上版本中出现pareseerror错误的解决方法
2011/01/11 Javascript
eval与window.eval的差别分析
2011/03/17 Javascript
推荐40款强大的 jQuery 导航插件和教程(上篇)
2012/09/14 Javascript
理解Javascript文件动态加载
2016/01/29 Javascript
JavaScript中eval函数的问题
2016/01/31 Javascript
AngularJs Injecting Services Into Controllers详解
2016/09/02 Javascript
JavaScript中利用for循环遍历数组
2017/01/15 Javascript
Vue.js中的图片引用路径的方式
2017/07/28 Javascript
vue 使用Jade模板写html,stylus写css的方法
2018/02/23 Javascript
Electron 如何调用本地模块的方法
2019/02/01 Javascript
详解vue实现坐标拾取器功能示例
2020/11/18 Vue.js
[05:06]TI4西雅图DOTA2前线报道 海涛密探LGD训练
2014/07/09 DOTA
python解析json实例方法
2013/11/19 Python
django之session与分页(实例讲解)
2017/11/13 Python
解决python3爬虫无法显示中文的问题
2018/04/12 Python
PyTorch上搭建简单神经网络实现回归和分类的示例
2018/04/28 Python
Python简单过滤字母和数字的方法小结
2019/01/09 Python
python文件操作的简单方法总结
2019/11/07 Python
解决python中的幂函数、指数函数问题
2019/11/25 Python
Python 模拟动态产生字母验证码图片功能
2019/12/24 Python
Python爬虫谷歌Chrome F12抓包过程原理解析
2020/06/04 Python
Python xlrd模块导入过程及常用操作
2020/06/10 Python
python 基于opencv操作摄像头
2020/12/24 Python
bonprix荷兰网上商店:便宜的服装、鞋子和家居用品
2020/07/04 全球购物
环保建议书
2014/03/12 职场文书
水毁工程实施方案
2014/04/01 职场文书
就业协议书
2014/09/12 职场文书
工程安全生产协议书
2014/11/21 职场文书
失恋33天观后感
2015/06/11 职场文书
繁星春水读书笔记
2015/06/30 职场文书
mysql 体系结构和存储引擎介绍
2022/05/06 MySQL
SqlServer常用函数及时间处理小结
2023/05/08 SQL Server