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 相关文章推荐
鼠标滚轴控制文本框值的JS代码
Nov 19 Javascript
JS实现将人民币金额转换为大写的示例代码
Feb 13 Javascript
javascript实现左右控制无缝滚动
Dec 31 Javascript
关于JavaScript的变量的数据类型的判断方法
Aug 14 Javascript
JavaScript 基础函数_深入剖析变量和作用域
May 18 Javascript
JS中正则表达式全局匹配模式 /g用法详解
Apr 01 Javascript
js 获取今天以及过去日期
Apr 11 Javascript
JavaScript 上传文件(psd,压缩包等),图片,视频的实现方法
Jun 19 Javascript
(模仿京东用户注册)用JQuery实现简单表单验证,初学者必看
Jan 08 jQuery
将RGB值转换为灰度值的简单算法
Oct 09 Javascript
JS实现躲避粒子小游戏
Jun 18 Javascript
Vuejs通过拖动改变元素宽度实现自适应
Sep 02 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中apc缓存使用示例
2013/12/25 PHP
Yii 快速,安全,专业的PHP框架
2014/09/03 PHP
PHP实现绘制3D扇形统计图及图片缩放实例
2014/10/01 PHP
php利用cookie实现自动登录的方法
2014/12/10 PHP
php类的定义与继承用法实例
2015/07/07 PHP
PHP获取文件扩展名的常用方法小结【五种方式】
2018/04/27 PHP
DOM精简教程
2006/10/03 Javascript
一个小型js框架myJSFrame附API使用帮助
2008/06/28 Javascript
javascript 当前日期加(天、周、月、年)
2009/08/09 Javascript
javascript instanceof 内部机制探析
2010/10/15 Javascript
js新闻滚动 js如何实现新闻滚动效果
2013/01/07 Javascript
不到30行JS代码实现Excel表格的方法
2014/11/15 Javascript
js实现格式化金额,字符,时间的方法
2015/02/26 Javascript
JavaScript学习小结之使用canvas画“哆啦A梦”时钟
2016/07/24 Javascript
vuejs2.0实现分页组件使用$emit进行事件监听数据传递的方法
2017/02/22 Javascript
使用JavaScript实现表格编辑器(实例讲解)
2017/08/02 Javascript
js时间戳与日期格式之间相互转换
2017/12/11 Javascript
vue一个页面实现音乐播放器的示例
2018/02/06 Javascript
微信小程序中使用ECharts 异步加载数据的方法
2018/06/27 Javascript
JavaScript中的回调函数实例讲解
2019/01/27 Javascript
jquery3和layui冲突导致使用layui.layer.full弹出全屏iframe窗口时高度152px问题
2019/05/12 jQuery
vue项目前端微信JSAPI与外部H5支付相关实现过程及常见问题
2020/04/14 Javascript
python交互式图形编程实例(二)
2017/11/17 Python
用python处理图片之打开\显示\保存图像的方法
2018/05/04 Python
解决Python列表字符不区分大小写的问题
2019/12/19 Python
使用python实现CGI环境搭建过程解析
2020/04/28 Python
美国女性奢华品牌精品店:INTERMIX
2017/10/12 全球购物
LINUX下线程,GDI类的解释
2016/12/14 面试题
化验室技术员岗位职责
2013/12/24 职场文书
《二泉映月》教学反思
2014/04/15 职场文书
绿色出行口号
2014/06/18 职场文书
离婚协议书格式
2014/11/21 职场文书
酒店工程部主管岗位职责
2015/04/16 职场文书
百家讲坛观后感
2015/06/12 职场文书
MySQL分库分表与分区的入门指南
2021/04/22 MySQL
Golang 遍历二叉树
2022/04/19 Golang