JQUERY对单选框(radio)操作的小例子


Posted in Javascript onApril 25, 2013

 

<asp:RadioButtonList runat="server" ID="rblShow" class="show"                 RepeatDirection="Horizontal">
                 <asp:ListItem Text="是" value="1" />
                 <asp:ListItem Text="否" value="0"/>
   </asp:RadioButtonList>
 <p class="isShow" style="width: 500px">
                测试文字
 </p>

然后在脚本js中添加Jquery引用后。
<script type="text/javascript">
         $(function () {
             $(":radio").click(function () {
                 if ($(this).val() == "1") {
                     $(".isShow").fadeIn();
                 } else {
                     $(".isShow").fadeOut();
                 }
             })
         })

$(":radio").click(function () 添加对radio的js事件,然后判断value后,对后面的测试文字进行淡入淡出操作。

OK,操作完成。如此便可以自由的操作页面上的任何元素了。

Javascript 相关文章推荐
浅谈javascript的原型继承
Jul 25 Javascript
使用js操作cookie的一点小收获分享
Sep 03 Javascript
jQuery点缩略图弹出层显示大图片
Feb 13 Javascript
window.setInterval()方法的定义和用法及offsetLeft与style.left的区别
Nov 11 Javascript
Javascript的表单与验证-非空验证
Mar 18 Javascript
jquery中live()方法和bind()方法区别分析
Jun 23 Javascript
基于canvas的二维码邀请函生成插件
Feb 14 Javascript
深入理解vue-loader如何使用
Jun 06 Javascript
vue-cli构建项目使用 less的方法
Oct 04 Javascript
JavaScript基础教程之如何实现一个简单的promise
Sep 11 Javascript
vue-cli3搭建项目的详细步骤
Dec 05 Javascript
Echarts如何重新渲染实例详解
May 30 Javascript
jQuery中 noConflict() 方法使用
Apr 25 #Javascript
只需20行代码就可以写出CSS覆盖率测试脚本
Apr 24 #Javascript
js Array对象的扩展函数代码
Apr 24 #Javascript
网页中返回顶部代码(多种方法)另附注释说明
Apr 24 #Javascript
onkeypress字符按键兼容所有浏览器使用介绍
Apr 24 #Javascript
纯JS实现五子棋游戏兼容各浏览器(附源码)
Apr 24 #Javascript
jquery仿京东导航/仿淘宝商城左侧分类导航下拉菜单效果
Apr 24 #Javascript
You might like
php+oracle 分页类
2006/10/09 PHP
php file_get_contents抓取Gzip网页乱码的三种解决方法
2013/11/12 PHP
PHP批量去除BOM头代码分享
2015/06/26 PHP
PHP pear安装配置教程
2016/05/14 PHP
php判断手机浏览还是web浏览,并执行相应的动作简单实例
2016/07/28 PHP
YII2框架中excel表格导出的方法详解
2017/07/21 PHP
JQuery 获得绝对,相对位置的坐标方法
2010/02/09 Javascript
用jquery实现等比例缩放图片效果插件
2010/07/24 Javascript
Google AJAX 搜索 API实现代码
2010/11/17 Javascript
js事件冒泡实例分享(已测试)
2013/04/23 Javascript
使用jQuery mobile库检测url绝对地址和相对地址的方法
2015/12/04 Javascript
javascript实现列表切换效果
2016/05/02 Javascript
关于input全选反选恶心的异常情况
2016/07/24 Javascript
深入理解jQuery3.0的domManip函数
2016/09/01 Javascript
如何快速上手Vuex
2017/02/14 Javascript
微信小程序 实现列表项滑动显示删除按钮的功能
2017/04/13 Javascript
配置nodejs环境的方法
2017/05/13 NodeJs
node.js中http模块和url模块的简单介绍
2017/10/06 Javascript
原生js封装添加class,删除class的实例
2017/11/06 Javascript
如何通过shell脚本自动生成vue文件详解
2019/09/10 Javascript
element的el-table中记录滚动条位置的示例代码
2019/11/06 Javascript
微信小程序批量上传图片到七牛(推荐)
2019/12/19 Javascript
关于javascript中的promise的用法和注意事项(推荐)
2021/01/15 Javascript
[02:26]2018DOTA2亚洲邀请赛赛前采访-Newbee篇
2018/04/03 DOTA
Python设计模式之门面模式简单示例
2018/01/09 Python
Python 编码规范(Google Python Style Guide)
2018/05/05 Python
用HTML5实现手机摇一摇的功能的教程
2012/10/30 HTML / CSS
实例讲解使用SVG制作loading加载动画的方法
2016/04/05 HTML / CSS
美国第一个网上卖鞋零售商:OnlineShoes.com
2017/09/24 全球购物
利物浦足球俱乐部官方网上商店:Liverpool FC Official Store
2018/01/13 全球购物
C#和SQL Server的面试题
2016/08/12 面试题
关于旷工的检讨书
2014/02/02 职场文书
有关爱国演讲稿
2014/05/07 职场文书
信贷客户经理岗位职责
2015/04/09 职场文书
WebRTC记录音视频流(web技术分享)
2022/02/24 Javascript
Python中itertools库的四个函数介绍
2022/04/06 Python