JS简单操作select和dropdownlist实例


Posted in Javascript onNovember 26, 2014

本文实例讲述了JS简单操作select和dropdownlist的方法。分享给大家供大家参考。具体实现方法如下:

一、js选中服务器控件select与dropdownlist

1. js操作服务器控件select

<select id="selectID" onchange="return showMessage()">

     <option value="0">==请选择==</option>

     <option value="1">是</option>

     <option value="2">否</option>

</select>


<script type="text/javascript" language="javascript">

  function showMessage() {

      if (document.getElementById("selectID").options[document.getElementById("selectID").selectedIndex].value == 1) {

   alert("你好,你选择了第 1 个");

   document.getElementById("txtContractName").setAttribute("enable",false);

      }

      else if (document.getElementById("selectID").options[document.getElementById("selectID").selectedIndex].value == 2) {

   alert("你好,你选择了第 2 个");

      }

  }

</script>
//js操作服务器控件dropdownlist

<asp:DropDownList ID="ddlFolder" runat="server" SkinID="ddlSkin" AutoPostBack="false" OnSelectedIndexChanged="ddlFolder_SelectedIndexChanged">    

        <asp:ListItem Value="0">选项0</asp:ListItem>   

   <asp:ListItem Value="1">选项1</asp:ListItem>  

</asp:DropDownList>    

<asp:DropDownList ID="ddlFolder" runat="server" SkinID="ddlSkin" AutoPostBack="false" OnSelectedIndexChanged="ddlFolder_SelectedIndexChanged"> 

  <asp:ListItem Value="0">选项0</asp:ListItem>

  <asp:ListItem Value="1">选项1</asp:ListItem> 

</asp:DropDownList>

JS代码:
document.getElementById("ddlFolder").value="0";//0为你要选中的项的value

2. 根据Text值设置选中某项

var DropDownListCurrencyNew =  document.getElementById("ddlFolder");

for(i = 0; i < DropDownListCurrencyNew.options.length; i++)

{

          if(DropDownListCurrencyNew.options[i].text == "选项0")    

           {

               DropDownListCurrencyNew.options[i].selected = true; 

          }

}

二、js读取DropDownList选中项的value和text

Value:

var selValue = document.getElementById("DropDownList1").options[document.getElementById("DropDownList1").selectedIndex].value;

Text:

var selText = document.getElementById("DropDownList1").options[document.getElementById("DropDownList1").selectedIndex].text;

希望本文所述对大家的js与.net程序设计有所帮助。

Javascript 相关文章推荐
javascript中对对层的控制
Dec 29 Javascript
jQuery Lightbox 图片展示插件使用说明
Apr 25 Javascript
jQuery创建自己的插件(自定义插件)的方法
Jun 10 Javascript
jQuery Tools tab(幻灯片)
Jul 14 Javascript
JavaScript 获取任一float型小数点后两位的小数
Jun 30 Javascript
Node.js与Sails ~项目结构与Mvc实现及日志机制
Oct 14 Javascript
JS实现在状态栏显示打字效果完整实例
Nov 02 Javascript
怎么限制input的text里输入的值只能是数字(正则、js)
May 16 Javascript
bootstrap配合Masonry插件实现瀑布式布局
Jan 18 Javascript
layui 弹出删除确认界面的实例
Sep 06 Javascript
vue 设置 input 为不可以编辑的实现方法
Sep 19 Javascript
node.js实现简单的压缩/解压缩功能示例
Nov 05 Javascript
node+express+ejs制作简单页面上手指南
Nov 26 #Javascript
node.js使用require()函数加载模块
Nov 26 #Javascript
javascript中setTimeout和setInterval的unref()和ref()用法示例
Nov 26 #Javascript
浅谈jQuery中对象遍历.eq().first().last().slice()方法
Nov 26 #Javascript
javascript 原型链维护和继承详解
Nov 26 #Javascript
jquery提示效果实例分析
Nov 25 #Javascript
jQuery操作cookie方法实例教程
Nov 25 #Javascript
You might like
跟我学小偷程序之成功偷取首页(第三天)
2006/10/09 PHP
无限级别菜单的实现
2006/10/09 PHP
PHP及Zend Engine的线程安全模型分析
2011/11/10 PHP
mouse_on_title.js
2006/08/25 Javascript
取得一定长度的内容,处理中文
2006/12/20 Javascript
jQuery 剧场版 你必须知道的javascript
2009/05/27 Javascript
javascript利用控件对windows的操作实现原理与应用
2012/12/23 Javascript
让你的博客飘雪花超出屏幕依然看得见
2013/01/04 Javascript
javascript操作css属性
2013/12/30 Javascript
jQuery中append()方法用法实例
2015/01/08 Javascript
Clipboard.js 无需Flash的JavaScript复制粘贴库
2015/10/02 Javascript
学习javascript的闭包,原型,和匿名函数之旅
2015/10/18 Javascript
Angular ng-repeat 对象和数组遍历实例
2016/09/14 Javascript
JS控制FileUpload的上传文件类型实例代码
2016/10/07 Javascript
简单谈谈CommonsChunkPlugin抽取公共模块
2017/12/31 Javascript
vue中echarts3.0自适应的方法
2018/02/26 Javascript
angular2/ionic2 实现搜索结果中的搜索关键字高亮的示例
2018/08/17 Javascript
微信小程序提取公用函数到util.js及使用方法示例
2019/01/10 Javascript
如何利用ES6进行Promise封装总结
2019/02/11 Javascript
小程序实现左滑删除效果
2019/07/25 Javascript
node.js中fs文件系统模块的使用方法实例详解
2020/02/13 Javascript
一个基于flask的web应用诞生 用户注册功能开发(5)
2017/04/11 Python
Python3内置模块之base64编解码方法详解
2019/07/13 Python
Python用input输入列表的实例代码
2020/02/07 Python
python基于openpyxl生成excel文件
2020/12/23 Python
python Protobuf定义消息类型知识点讲解
2021/03/02 Python
一款纯css3实现的颜色渐变按钮的代码教程
2014/11/12 HTML / CSS
8款使用 CSS3 实现超炫的 Loading(加载)的动画效果
2015/03/17 HTML / CSS
Jabra捷波朗美国官网:用于办公、车载和运动的无线蓝牙耳麦
2017/02/01 全球购物
2014年教师培训的自我评价
2014/01/03 职场文书
关于环保的建议书400字
2014/03/12 职场文书
如何撰写一封出色的求职信
2014/04/27 职场文书
工作目标责任书
2014/07/23 职场文书
村道德模范事迹材料
2014/08/28 职场文书
大班下学期幼儿评语
2014/12/30 职场文书
物业工程部主管岗位职责
2015/04/16 职场文书