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 相关文章推荐
js限制文本框为整数和货币的函数代码
Oct 13 Javascript
javascript检测页面是否缩放的小例子
May 16 Javascript
jquery+ajax实现跨域请求的方法
Jan 20 Javascript
javascript中数组的定义及使用实例
Jan 21 Javascript
JS根据浏览器窗口大小实时动态改变网页文字大小的方法
Feb 25 Javascript
js学习之----深入理解闭包
Nov 21 Javascript
js鼠标经过tab选项卡时实现切换延迟
Mar 24 Javascript
js实现随机数字字母验证码
Jun 19 Javascript
IE11下使用canvas.toDataURL报SecurityError错误的解决方法
Nov 19 Javascript
详解CommonJS和ES6模块循环加载处理的区别
Dec 26 Javascript
深入分析element ScrollBar滚动组件源码
Jan 22 Javascript
Node.js + express实现上传大文件的方法分析【图片、文本文件】
Mar 14 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
PHP持久连接mysql_pconnect()函数使用介绍
2012/02/05 PHP
php图片缩放实现方法
2014/02/20 PHP
PHP简单获取及判断提交来源的方法
2016/04/22 PHP
表单内同名元素的控制
2006/11/22 Javascript
csdn 论坛技术区平均给分功能
2009/11/07 Javascript
分享27个jQuery 表单插件集合推荐
2011/04/25 Javascript
『JavaScript』限制Input只能输入数字实现思路及代码
2013/04/22 Javascript
javascript为下拉列表动态添加数据项
2014/05/23 Javascript
json+jQuery实现的无限级树形菜单效果代码
2015/08/27 Javascript
jQuery实现可用于博客的动态滑动菜单完整实例
2015/09/17 Javascript
jquery实现二级导航下拉菜单效果
2015/12/18 Javascript
基于Turn.js 实现翻书效果实例解析
2016/06/20 Javascript
手把手教你把nodejs部署到linux上跑出hello world
2017/06/19 NodeJs
使用cookie绕过验证码登录的实现代码
2017/10/12 Javascript
使用socket.io实现简单聊天室案例
2018/01/02 Javascript
Angular实现的进度条功能示例
2018/02/18 Javascript
基于 Immutable.js 实现撤销重做功能的实例代码
2018/03/01 Javascript
layui之select的option叠加问题的解决方法
2018/03/08 Javascript
Vue.js中关于侦听器(watch)的高级用法示例
2018/05/02 Javascript
require.js 加载过程与使用方法介绍
2018/10/30 Javascript
微信小程序中button去除默认的边框实例代码
2019/08/01 Javascript
Python struct模块解析
2014/06/12 Python
Python使用py2exe打包程序介绍
2014/11/20 Python
django允许外部访问的实例讲解
2018/05/14 Python
Python嵌套函数,作用域与偏函数用法实例分析
2019/12/26 Python
Python自动化xpath实现自动抢票抢货
2020/09/19 Python
Python的3种运行方式:命令行窗口、Python解释器、IDLE的实现
2020/10/10 Python
Python列表元素删除和remove()方法详解
2021/01/04 Python
python gui开发——制作抖音无水印视频下载工具(附源码)
2021/02/07 Python
浅析几个CSS3常用功能的写法
2014/06/05 HTML / CSS
幼儿园义卖活动方案
2014/01/17 职场文书
协议书怎么写
2014/04/21 职场文书
公司应聘求职信
2014/06/21 职场文书
检讨书范文大全
2015/05/07 职场文书
故意伤害辩护词
2015/05/21 职场文书
python使用glob检索文件的操作
2021/05/20 Python