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 相关文章推荐
使用jQuery fancybox插件打造一个实用的数据传输模态弹出窗体
Jan 15 Javascript
js 动态为textbox添加下拉框数据源的方法
Apr 24 Javascript
javascript在IE下trim函数无法使用的解决方法
Sep 12 Javascript
基于JavaScript实现仿京东图片轮播效果
Nov 06 Javascript
AngularGauge 属性解析详解
Sep 06 Javascript
javascript this详细介绍
Sep 19 Javascript
JavaScript面向对象分层思维全面解析
Nov 22 Javascript
JS实现的简单轮播图运动效果示例
Dec 22 Javascript
vue-cli+axios实现文件上传下载功能(下载接收后台返回文件流)
May 10 Javascript
node.js事件轮询机制原理知识点
Dec 22 Javascript
JS动态图片的实现方法完整示例
Jan 13 Javascript
为react组件库添加typescript类型提示的方法
Jun 15 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的简单采集数据入库程序【续篇】
2014/07/30 PHP
WordPress主题制作中自定义头部的相关PHP函数解析
2016/01/08 PHP
插件:检测javascript的内存泄漏
2007/03/04 Javascript
DOM 脚本编程中的兄弟节点
2009/10/31 Javascript
javascript loadScript异步加载脚本示例讲解
2013/11/14 Javascript
jquery实现手风琴效果实例代码
2013/11/15 Javascript
当达到输入长度时表单自动切换焦点
2014/04/06 Javascript
javascript版的in_array函数(判断数组中是否存在特定值)
2014/05/09 Javascript
jQuery 中DOM 操作详解
2015/01/13 Javascript
使用JavaScript 实现的人脸检测
2015/03/24 Javascript
JS非Alert实现网页右下角“未读信息”效果弹窗
2015/09/26 Javascript
Bootstrap源码解读标签、徽章、缩略图和警示框(8)
2016/12/26 Javascript
vue.js分页中单击页码更换页面内容的方法(配合spring springmvc)
2018/02/10 Javascript
vue2实现搜索结果中的搜索关键字高亮的代码
2018/08/29 Javascript
详解ES6中的 Set Map 数据结构学习总结
2018/11/06 Javascript
VUE注册全局组件和局部组件过程解析
2019/10/10 Javascript
Python爬虫通过替换http request header来欺骗浏览器实现登录功能
2018/01/07 Python
python实现学生信息管理系统
2020/04/05 Python
python Tkinter版学生管理系统
2019/02/20 Python
Django Form 实时从数据库中获取数据的操作方法
2019/07/25 Python
微信小程序python用户认证的实现
2019/07/29 Python
Flask教程之重定向与错误处理实例分析
2019/08/01 Python
PyCharm中关于安装第三方包的三个建议
2020/09/17 Python
html5教程画矩形代码分享
2013/12/04 HTML / CSS
Booking.com荷兰:全球酒店网上预订
2017/08/22 全球购物
泰国汽车、火车和轮渡票预订网站:Bus Online Ticket
2017/09/09 全球购物
孕妇内衣和胸罩:Cake Maternity
2018/07/16 全球购物
Groupon荷兰官方网站:高达70%的折扣
2019/11/01 全球购物
2014年教师工作总结
2014/11/10 职场文书
国家助学金感谢信
2015/01/21 职场文书
2016年百日安全生产活动总结
2016/04/06 职场文书
golang json数组拼接的实例
2021/04/28 Golang
解决goland 导入项目后import里的包报红问题
2021/05/06 Golang
python字符串拼接.join()和拆分.split()详解
2021/11/23 Python
详解MySQL的主键查询为什么这么快
2022/04/03 MySQL
python中pd.cut()与pd.qcut()的对比及示例
2022/06/16 Python