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 相关文章推荐
ExtJS4 动态生成的grid导出为excel示例
May 02 Javascript
javascript event在FF和IE的兼容传参心得(绝对好用)
Jul 10 Javascript
jQuery 插件开发指南
Nov 14 Javascript
jQuery动态效果显示人物结构关系图的方法
May 07 Javascript
jquery分析文本里url或邮件地址为真实链接的方法
Jun 20 Javascript
IE6兼容透明背景图片及解决方案
Aug 19 Javascript
jQuery实时显示鼠标指针位置和键盘ASCII码
Mar 28 Javascript
微信小程序网络请求的封装与填坑之路
Apr 01 Javascript
细说webpack6 Babel的使用详解
Sep 26 Javascript
vue 中url 链接左边的小图标更改问题
Dec 30 Javascript
微信小程序个人中心的列表控件实现代码
Apr 26 Javascript
javascript实现简单留言板案例
Feb 09 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
有关phpmailer的详细介绍及使用方法
2013/01/28 PHP
php使用 readfile() 函数设置文件大小大小的方法
2017/08/11 PHP
thinkPHP框架中执行原生SQL语句的方法
2017/10/25 PHP
PHP Beanstalkd消息队列的安装与使用方法实例详解
2020/02/21 PHP
htm调用JS代码
2007/03/15 Javascript
Highslide.js是一款基于js实现的网页中图片展示插件
2020/03/30 Javascript
js给onclick事件赋值,动态传参数实例解说
2013/03/28 Javascript
js 编码转换 gb2312 和 utf8 互转的2种方法
2013/08/07 Javascript
用box固定长宽实现图片自动轮播js代码
2014/06/09 Javascript
JavaScript+CSS实现的可折叠二级菜单实例
2016/02/29 Javascript
jQuery Mobile开发中日期插件Mobiscroll使用说明
2016/03/02 Javascript
JavaScript实现显示函数调用堆栈的方法
2016/04/21 Javascript
JS onkeypress兼容性写法详解
2016/04/27 Javascript
AngularJS 过滤器(自带和自建)详解
2016/09/19 Javascript
JavaScript实现三级联动菜单实例代码
2017/06/26 Javascript
JavaScript输入分钟、秒倒计时技巧总结(附代码)
2017/08/17 Javascript
JavaScript如何对图片进行黑白化
2018/04/10 Javascript
Vue中实现权限控制的方法示例
2019/06/07 Javascript
layui 实现表格某一列显示图标
2019/09/19 Javascript
详解mpvue开发微信小程序基础知识
2019/09/23 Javascript
Vue实现附件上传功能
2020/05/28 Javascript
[02:08]什么藏在DOTA2 TI9“小紫本”里?斧王历险记告诉你!
2019/05/17 DOTA
python批量修改文件后缀示例代码分享
2013/12/24 Python
Python发送Email方法实例
2014/08/21 Python
Python自定义函数实现求两个数最大公约数、最小公倍数示例
2018/05/21 Python
python 轮询执行某函数的2种方式
2020/05/03 Python
Python生成pdf目录书签的实例方法
2020/10/29 Python
canvas实现有递增动画的环形进度条的实现方法
2019/07/10 HTML / CSS
您的网上新华书店:文轩网
2016/08/24 全球购物
东方电视购物:东方CJ
2016/10/12 全球购物
优秀护士演讲稿
2014/04/30 职场文书
3的组成教学反思
2014/04/30 职场文书
不遵守课堂纪律的检讨书
2014/09/24 职场文书
毕业实习自我鉴定范文2014
2014/09/26 职场文书
漫画《催眠麦克风-Dawn Of Divisions》第二卷PV公开
2022/04/05 日漫