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 相关文章推荐
QQ邮箱的一个文本编辑器代码
Mar 14 Javascript
ie 调试javascript的工具
Apr 29 Javascript
Juqery Html(),append()等方法的Bug解决方法
Dec 13 Javascript
event.currentTarget与event.target的区别介绍
Dec 31 Javascript
jquery中$(#form :input)与$(#form input)的区别
Aug 18 Javascript
使用ajax+jqtransform实现动态加载select
Dec 01 Javascript
JavaScript实现身份证验证代码
Feb 17 Javascript
vue模板语法-插值详解
Mar 06 Javascript
Centos6.8下Node.js安装教程
May 12 Javascript
JS实现的按钮点击颜色切换功能示例
Oct 19 Javascript
JavaScript调用模式与this关键字绑定的关系
Apr 21 Javascript
小程序分享模块超级详解(推荐)
Apr 10 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
在php和MySql中计算时间差的方法详解
2015/03/27 PHP
php 输入输出流详解及示例代码
2016/08/25 PHP
CI框架常用经典操作类总结(路由,伪静态,分页,session,验证码等)
2016/11/21 PHP
Laravel的Auth验证Token验证使用自定义Redis的例子
2019/09/30 PHP
Web版彷 Visual Studio 2003 颜色选择器
2007/01/09 Javascript
js wmp操作代码小结(音乐连播功能)
2008/11/08 Javascript
jQuery之按钮组件的深入解析
2013/06/19 Javascript
JSON+HTML实现国家省市联动选择效果
2014/05/18 Javascript
超赞的jQuery图片滑块动画特效代码汇总
2016/01/25 Javascript
sso跨域写cookie的一段js脚本(推荐)
2016/05/25 Javascript
Vue报错:Uncaught TypeError: Cannot assign to read only property’exports‘ of object’#‘的解决方法
2017/06/17 Javascript
使用D3.js制作图表详解
2017/08/13 Javascript
js + css实现标签内容切换功能(实例讲解)
2017/10/09 Javascript
JS实现点击生成UUID的方法完整实例【基于jQuery】
2019/06/12 jQuery
vue iview的菜单组件Mune 点击不高亮的解决方案
2019/11/01 Javascript
Vue单文件组件开发实现过程详解
2020/07/30 Javascript
jQuery实现简单轮播图效果
2020/12/27 jQuery
Python调用C语言的实现
2019/07/26 Python
Python3从零开始搭建一个语音对话机器人的实现
2019/08/23 Python
Django DRF路由与扩展功能的实现
2020/06/03 Python
Python工程师必考的6个经典面试题
2020/06/28 Python
美国最大的香水连锁店官网:Perfumania
2016/08/15 全球购物
英国电信商店:BT Shop
2019/12/17 全球购物
速卖通欧盟:Aliexpress EU
2020/08/19 全球购物
模具专业毕业生自荐书范文
2014/02/19 职场文书
小学优秀辅导员事迹材料
2014/05/11 职场文书
学校门卫岗位职责范本
2014/06/30 职场文书
先进个人事迹材料
2014/12/29 职场文书
故宫英文导游词
2015/01/31 职场文书
2015年世界急救日宣传活动方案
2015/05/06 职场文书
话题作文之自信作文
2019/11/15 职场文书
pytorch交叉熵损失函数的weight参数的使用
2021/05/24 Python
Python连续赋值需要注意的一些问题
2021/06/03 Python
Nginx设置HTTPS的方法步骤 443证书配置方法
2022/03/21 Servers
解决vue自定义组件@click点击失效问题
2022/04/30 Vue.js
ant design vue的form表单取值方法
2022/06/01 Vue.js