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 相关文章推荐
Code:loadScript( )加载js的功能函数
Feb 02 Javascript
JQuery this 和 $(this) 的区别
Aug 23 Javascript
引用外部js乱码问题分析及解决方案
Apr 12 Javascript
jquery库文件略庞大用纯js替换jquery的方法
Aug 12 Javascript
jquery 取子节点及当前节点属性值的方法
Aug 24 Javascript
jQuery实现底部浮动窗口效果
Sep 07 Javascript
require、backbone等重构手机图片查看器
Nov 17 Javascript
Bootstrap实现圆角、圆形头像和响应式图片
Dec 14 Javascript
JS表单提交验证、input(type=number) 去三角 刷新验证码
Jun 21 Javascript
Angular表格神器ui-grid应用详解
Sep 29 Javascript
json对象及数组键值的深度大小写转换问题详解
Mar 30 Javascript
react-native 圆弧拖动进度条实现的示例代码
Apr 12 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
丧钟首部独立剧集《丧钟:骑士与龙》北美正式开播,场面血腥
2020/04/09 欧美动漫
php+mysql分页代码详解
2008/03/27 PHP
php构造函数实例讲解
2013/11/13 PHP
php在数据库抽象层简单使用PDO的方法
2015/11/03 PHP
php调用自己java程序的方法详解
2016/05/13 PHP
详解Laravel视图间共享数据与视图Composer
2016/08/04 PHP
ThinkPHP中Widget扩展的两种写法及调用方法详解
2017/05/04 PHP
tp5 实现列表数据根据状态排序
2019/10/18 PHP
node.js中的path.resolve方法使用说明
2014/12/08 Javascript
jQuery+AJAX实现网页无刷新上传
2015/02/22 Javascript
JavaScript中的getTime()方法使用详解
2015/06/10 Javascript
基于js实现微信发送好友如何分享到朋友圈、微博
2015/11/30 Javascript
setTimeout时间设置为0详细解析
2018/03/13 Javascript
解决iView中时间控件选择的时间总是少一天的问题
2018/03/15 Javascript
vue 巧用过渡效果(小结)
2018/09/22 Javascript
JS获取当前时间的实例代码(昨天、今天、明天)
2018/11/13 Javascript
原生JS实现的跳一跳小游戏完整实例
2019/01/27 Javascript
layui加载表格,绑定新增,编辑删除,查看按钮事件的例子
2019/09/06 Javascript
OpenLayers3实现地图鹰眼以及地图比例尺的添加
2020/09/25 Javascript
python生成日历实例解析
2014/08/21 Python
Python爬虫爬验证码实现功能详解
2016/04/14 Python
详解Python的collections模块中的deque双端队列结构
2016/07/07 Python
Pandas读取并修改excel的示例代码
2019/02/17 Python
PyQt5组件读取参数的实例
2019/06/25 Python
python给指定csv表格中的联系人群发邮件(带附件的邮件)
2019/12/31 Python
python如何把字符串类型list转换成list
2020/02/18 Python
Python如何把字典写入到CSV文件的方法示例
2020/08/23 Python
心碎乌托邦的创业计划书范文
2013/12/26 职场文书
党校学习思想汇报
2014/01/06 职场文书
社团文化节邀请函
2014/01/10 职场文书
女方婚礼新郎答谢词
2014/01/11 职场文书
文科毕业生自荐书范文
2014/04/17 职场文书
离婚协议书怎么写
2014/09/12 职场文书
先进个人申报材料
2014/12/30 职场文书
青春雷锋观后感
2015/06/10 职场文书
MySQL8.0.18配置多主一从
2021/06/21 MySQL