ASP.NET jQuery 实例7 通过jQuery来获取DropDownList的Text/Value属性值


Posted in Javascript onFebruary 03, 2012

界面代码:

<form id="form1" runat="server"> 
<div align="center"> 
<fieldset style="width: 400px; height: 80px;"> 
<p> 
选择颜色:</p> 
<asp:DropDownList ID="ddlColor" runat="server"> 
<asp:ListItem Text="--- 请选择 ---" Value=""></asp:ListItem> 
<asp:ListItem Text="红色" Value="1"></asp:ListItem> 
<asp:ListItem Text="黄色" Value="2"></asp:ListItem> 
<asp:ListItem Text="蓝色" Value="3"></asp:ListItem> 
</asp:DropDownList> 
</fieldset> 
</div> 
<br /> 
<div align="center" id="message"> 
</div> 
</form>

脚本代码:
<script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(document).ready(function () { 
// 绑定keyup和change事件 
$("#<%=ddlColor.ClientID %>").bind("keyup change", function () { 
if ($(this).val() != "") { 
// 这里需要注意,$(this).text()获取的是整个集合的text属性内容,所以需要再过滤下,把选中的项取出来 
$("#message").text("Text: " + $(this).find(":selected").text() + "Value: " + $(this).val()); 
} 
else { 
$("#message").text(""); 
} 
}); 
}); 
</script>

选择一种颜色显示如下:

ASP.NET jQuery 实例7 通过jQuery来获取DropDownList的Text/Value属性值

Javascript 相关文章推荐
Convert Seconds To Hours
Jun 16 Javascript
JS性能优化笔记搜索整理
Aug 21 Javascript
把字符串按照特定的字母顺序进行排序的js代码
Jan 28 Javascript
利用jQuery实现WordPress中@的ID悬浮显示评论内容
Dec 11 Javascript
JavaScript开发Chrome浏览器扩展程序UI的教程
May 16 Javascript
js表单登陆验证示例
Oct 19 Javascript
jQuery实现键盘回车搜索功能
Jul 25 jQuery
vue动态绑定class的几种常用方式小结
May 21 Javascript
javascript防抖函数debounce详解
Jun 11 Javascript
微信小程序如何实现radio单选框单击打勾和取消
Jan 21 Javascript
Js数组扁平化实现方法代码总汇
Nov 11 Javascript
JavaScript中的Proxy对象
Nov 27 Javascript
jQuery表单验证插件formValidator(改进版)
Feb 03 #Javascript
jQuery.extend 函数详解
Feb 03 #Javascript
jquery插件开发方法(初学者)
Feb 03 #Javascript
jquery插件制作简单示例说明
Feb 03 #Javascript
jQuery数组处理代码详解(含实例演示)
Feb 03 #Javascript
8款非常棒的响应式jQuery 幻灯片插件推荐
Feb 02 #Javascript
JQuery中判断一个元素下面是否有内容或者有某个标签的判断代码
Feb 02 #Javascript
You might like
解析Javascript中难以理解的11个问题
2013/12/09 Javascript
使用jQuery实现星级评分代码分享
2014/12/09 Javascript
Node.js抓取中文网页乱码问题和解决方法
2015/02/10 Javascript
web前端开发JQuery常用实例代码片段(50个)
2015/08/28 Javascript
浅析jQuery Ajax通用js封装
2016/06/22 Javascript
概述javascript在Google IE中的调试技巧
2016/11/24 Javascript
JS中with的替代方法与String中的正则方法详解
2016/12/23 Javascript
javascript函数的四种调用模式
2017/01/08 Javascript
VUE JS 使用组件实现双向绑定的示例代码
2017/01/10 Javascript
vue实现ToDoList简单实例
2017/02/07 Javascript
jQuery插件HighCharts绘制的2D堆柱状图效果示例【附demo源码下载】
2017/03/14 Javascript
jQuery实现可编辑表格并生成json结果(实例代码)
2017/07/19 jQuery
JS中定位 position 的使用实例代码
2017/08/06 Javascript
JS库之ParticlesJS使用简介
2017/09/12 Javascript
js实现登录注册框手机号和验证码校验(前端部分)
2017/09/28 Javascript
js实现左右两侧浮动广告
2018/07/09 Javascript
Vuex mutitons和actions初使用详解
2019/03/04 Javascript
详解使用React.memo()来优化函数组件的性能
2019/03/19 Javascript
jquery轻量级数字动画插件countUp.js使用详解
2019/10/17 jQuery
[01:37]DOTA2超级联赛专访ChuaN 传奇般的电竞之路
2013/06/19 DOTA
Python中使用MELIAE分析程序内存占用实例
2015/02/18 Python
在Python中使用PIL模块处理图像的教程
2015/04/29 Python
django将图片上传数据库后在前端显式的方法
2018/05/25 Python
python 以16进制打印输出的方法
2018/07/09 Python
面向对象学习之pygame坦克大战
2019/09/11 Python
澳大利亚领先的内衣店:Bendon Lingerie澳大利亚
2020/05/15 全球购物
应届生骨科医生求职信
2013/10/31 职场文书
农业资源与环境专业自荐信范文
2013/12/30 职场文书
《搭石》教学反思
2014/04/07 职场文书
电子商务系毕业生自荐信
2014/05/29 职场文书
2014年扶贫工作总结
2014/11/18 职场文书
合作意向协议书
2015/01/29 职场文书
个人工作失误的保证书怎么写?
2019/06/21 职场文书
Python包argparse模块常用方法
2021/06/04 Python
MySql如何将查询的出来的字段进行转换
2022/06/14 MySQL