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 相关文章推荐
jQuery 动画弹出窗体支持多种展现方式
Apr 29 Javascript
ListBox实现上移,下移,左移,右移的简单实例
Feb 13 Javascript
JS实现响应鼠标点击动画渐变弹出层效果代码
Mar 25 Javascript
js实现div在页面拖动效果
May 04 Javascript
JS中IP地址与整数相互转换的实现代码
Apr 10 Javascript
将 vue 生成的 js 上传到七牛的实例
Jul 28 Javascript
了解ESlint和其相关操作小结
May 21 Javascript
Angular(5.2-&gt;6.1)升级小结
Dec 27 Javascript
vue3修改link标签默认icon无效问题详解
Oct 09 Javascript
javascript异常处理实现原理详解
Feb 17 Javascript
JS面试题中深拷贝的实现讲解
May 07 Javascript
Vue2.0 $set()的正确使用详解
Jul 28 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
利用递归把多维数组转为一维数组的函数
2006/10/09 PHP
PHP中preg_match正则匹配中的/u、/i、/s含义
2015/04/17 PHP
总结PHP如何获取当前主机、域名、网址、路径、端口和参数等
2016/09/09 PHP
php+ajax实现商品对比功能示例
2019/04/13 PHP
PHP使用HTML5 FileApi实现Ajax上传文件功能示例
2019/07/01 PHP
javascript 跨浏览器开发经验总结(五) js 事件
2010/05/19 Javascript
UpdatePanel和Jquery冲突的解决方法
2013/04/01 Javascript
JS获得URL超链接的参数值实例代码
2013/06/21 Javascript
js arguments,jcallee caller用法总结
2013/11/30 Javascript
禁止iframe脚本弹出的窗口覆盖了父窗口的方法
2014/09/06 Javascript
深入浅析JavaScript中对事件的三种监听方式
2015/09/29 Javascript
基于JavaScript实现动态创建表格和增加表格行数
2015/12/20 Javascript
使用vue构建移动应用实战代码
2017/08/02 Javascript
详解使用vue-admin-template的优化历程
2018/05/20 Javascript
详解JS函数stack size计算方法
2018/06/18 Javascript
JS/jQuery实现获取时间的方法及常用类完整示例
2019/03/07 jQuery
4 种滚动吸顶实现方式的比较
2019/04/09 Javascript
nodejs中request库使用HTTPS代理的方法
2019/04/30 NodeJs
Openlayers实现扩散的动态点(水纹效果)
2020/08/17 Javascript
在vue中使用inheritAttrs实现组件的扩展性介绍
2020/12/07 Vue.js
[06:45]DOTA2-DPC中国联赛 正赛 Magma vs LBZS 选手采访
2021/03/11 DOTA
Python中lambda的用法及其与def的区别解析
2014/07/28 Python
Python中处理字符串之endswith()方法的使用简介
2015/05/18 Python
解决jupyter运行pyqt代码内核重启的问题
2020/04/16 Python
Scrapy中如何向Spider传入参数的方法实现
2020/09/28 Python
Python 2.6.6升级到Python2.7.15的详细步骤
2020/12/14 Python
德国网上花店:Valentins
2018/08/15 全球购物
美国椅子和沙发制造商:La-Z-Boy
2020/10/25 全球购物
C语言笔试题
2014/09/04 面试题
小学门卫岗位职责
2013/12/17 职场文书
个人遵守党的政治纪律情况对照检查材料
2014/09/26 职场文书
委托书格式范文
2015/01/28 职场文书
补充协议书
2015/01/28 职场文书
杜甫草堂导游词
2015/02/03 职场文书
公司禁烟通知
2015/04/23 职场文书
Python爬虫基础之简单说一下scrapy的框架结构
2021/06/26 Python