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 window.onload 加载多个函数的方法
Nov 02 Javascript
javascript动态加载三
Aug 22 Javascript
JS简单的图片放大缩小的两种方法
Nov 11 Javascript
React.js入门学习第一篇
Mar 30 Javascript
浅谈JS继承_寄生式继承 &amp; 寄生组合式继承
Aug 16 Javascript
JS实现的图片预览插件与用法示例【不上传图片】
Nov 25 Javascript
浅析JavaScript中的特殊数据类型
Dec 15 Javascript
vue项目中实现图片预览的公用组件功能
Oct 26 Javascript
微信小程序简单的canvas裁剪图片功能详解
Jul 12 Javascript
微信小程序获取用户绑定手机号方法示例
Jul 21 Javascript
JavaScript交换变量的常用方法小结【4种方法】
May 07 Javascript
node中短信api实现验证码登录的示例代码
Jan 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 Socket写的POP3类
2013/10/30 PHP
Codeigniter生成Excel文档的简单方法
2014/06/12 PHP
兼容PHP和Java的des加密解密代码分享
2014/06/26 PHP
laravel 5 实现模板主题功能(续)
2015/03/02 PHP
php封装的连接Mysql类及用法分析
2015/12/10 PHP
PHP与SQL语句常用大全
2016/12/10 PHP
PHP空值检测函数与方法汇总
2017/11/19 PHP
js post方式传递提交的实现代码
2010/05/31 Javascript
boxy基于jquery的弹出层对话框插件扩展应用 弹出层选择器
2010/11/21 Javascript
JavaScript阻止事件冒泡示例分享
2014/12/28 Javascript
JS实现可调整倒计时间代码分享
2015/08/18 Javascript
jquery+ajax实现注册实时验证实例详解
2015/12/08 Javascript
jQuery插件datatables使用教程
2016/04/21 Javascript
详解JavaScript实现设计模式中的适配器模式的方法
2016/05/18 Javascript
浅析angularJS中的ui-router和ng-grid模块
2016/05/20 Javascript
基于Bootstrap实现图片轮播效果
2016/05/22 Javascript
使用jQuery调用XML实现无刷新即时聊天
2016/08/07 Javascript
学习掌握JavaScript中this的使用技巧
2016/08/29 Javascript
vue.js单页面应用实例的简单实现
2017/04/10 Javascript
Vue结合Video.js播放m3u8视频流的方法示例
2018/05/04 Javascript
vue.js表单验证插件(vee-validate)的使用教程详解
2019/05/23 Javascript
vue单元格多列合并的实现
2020/11/26 Vue.js
win7上python2.7连接mysql数据库的方法
2017/01/14 Python
Python判断文件和字符串编码类型的实例
2017/12/21 Python
Python实现通讯录功能
2018/02/22 Python
python3利用ctypes传入一个字符串类型的列表方法
2019/02/12 Python
pygame实现俄罗斯方块游戏(对战篇1)
2019/10/29 Python
python使用 cx_Oracle 模块进行查询操作示例
2019/11/28 Python
小学亲子活动总结
2014/07/01 职场文书
防灾减灾宣传标语
2014/10/07 职场文书
2014年班务工作总结
2014/12/02 职场文书
先进班集体申报材料
2014/12/26 职场文书
网络营销计划书
2015/01/17 职场文书
碧霞祠导游词
2015/02/09 职场文书
python基于scrapy爬取京东笔记本电脑数据并进行简单处理和分析
2021/04/14 Python
人工智能深度学习OpenAI baselines的使用方法
2022/05/20 Python