button点击切换,获取按钮ID
<!DOCTYPE html>
<html>
<head lang="zh-CN">
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<style>
.sms-type button{
width: 60px;
height: 30px;
margin-right: 10px;
border: #d0d0d0 1px solid;
background-color: #f5f5f5;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
outline: none;
cursor: pointer;
}
.sms-type button.on-sel{
border: #ff7e0e 1px solid;
background-color: #fff0c5;
}
</style>
<script type="text/javascript" src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
<script type="text/javascript">
function replyDetailClick(){
$(".reply-details .sms-type button").click(function(){
$(".reply-details .sms-type button").removeClass("on-sel");
$(this).addClass("on-sel");
})
}
function getButtonId(){
$(".sms-type button").click(function(){
var buttonId = $(this).attr("id");
alert("buttonId:"+buttonId);
});
} $(document).ready(function() {
replyDetailClick();
getButtonId();
});
</script> </head>
<body>
<div class="reply-details">
<div>
<label class="sms-type">
<button id="all" class="on-sel">全部</button>
<button id="one">1</button>
<button id="two">2</button>
<button id="three">3</button>
<button id="other">其他</button>
</label>
</div>
</div>
</body>
</html>
button点击切换,获取按钮ID的更多相关文章
- 点击鼠标获取元素ID
原文:点击鼠标获取元素ID public partial class Form1 : Form { public Form1() { InitializeComponent(); } private ...
- Taro button点击切换选中状态
1.引入组件 2.state中设置选中状态 // button按钮的默认选中,0代表选中 state = { currentIndex: 0 } 3.设置class的样式,点击更改选中 selectN ...
- Android Button点击效果(按钮背景变色、文字变色)
一. 说明 Android Button的使用过程中,我们会需要为Button添加点击效果,不仅仅按钮的背景色需要变化,而且有时,我们连文字的颜色都希望变化,我们可以使用StateListDrawab ...
- $工具, 属性, TAB点击切换
$工具方法 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <tit ...
- 利用DOM的方式点击切换图片及修改文字
本案例主要学习理解,用到的几个DOM方法 01.getAttribute()方法,获取元素的属性值 02.setAttribute('src',source) 方法,用后边的值修改前边这个元素的属性值 ...
- Swift - 获取、改变按钮的标题文本(UIButton点击切换title)
在开发中,我们常常需要动态地改变按钮标签文字,使用 setTitle() 函数就可以了.有时我们需要在几个标题间切换,比如下面样例所示,按钮点击后按钮文字会在"播放""暂 ...
- jquery——左右按钮点击切换一组图片功能
一.最终效果 二.功能分析 1.需求分析 点击左边pre按钮,显示前面三个图片,点击右边的next按钮,显示后面的一组(三个)图片.初始化只显示next按钮,到最后一组只显示pre按钮,中间过程两按钮 ...
- NX二次开发-获取按钮的ID UF_MB_ask_button_id
NX9+VS2012 1.打开D:\Program Files\Siemens\NX 9.0\UGII\menus\ug_main.men 找到装配和PMI,在中间加上一段 TOGGLE_BUTTON ...
- .net学习之母版页执行顺序、jsonp跨域请求原理、IsPostBack原理、服务器端控件按钮Button点击时的过程、缓存、IHttpModule 过滤器
1.WebForm使用母版页后执行的顺序是先执行子页面中的Page_Load,再执行母版页中的Page_Load,请求是先生成母版页的控件树,然后将子页面生成的控件树填充到母版页中,最后输出 2.We ...
随机推荐
- Nagios监控的部署与配置
[安装Nagios] yum install -y httpd httpd-devel httpd-tools mysql mysql-devel mysql-server php php-devel ...
- 深度爬取之rules
深度爬取之rules CrawlSpider使用rules来决定爬虫的爬取规则,并将匹配后的url请求提交给引擎.所以在正常情况下,CrawlSpider不需要单独手动返回请求了. 在rules中包含 ...
- Docker学习笔记 - Docker的远程访问
学习内容: 配置客户端与守护进程的远程访问 服务端配置-H选项: 使服务端支持远程被访问 客户端使用-H选项: 使客户端访问远程服务端 本地环境DOCKER_HOST设置客户端访问的默认服务端地址 准 ...
- 新概念英语(1-43)Hurry up!
新概念英语(1-43)Hurry up! How do you know Sam doesn't make the tea very often? A:Can you make the tea, Sa ...
- mysql(3)—— 内连接、外连接的区别
先来看一下,内连接的语法: SELECT XXX FROM XXX INNER JOIN XXX ON XXX; 这里 INNER 可以省略,在上一篇博客中我们对于笛卡尔积现象的研究中(http:/ ...
- Linux中的重启命令
1.系统重启: shutdowm 该命令安全地将系统关机. 有些用户会使用直接断掉电源的方式来关闭linux,这是十分危险的.因为linux与windows不同,其后台运行着许多进程,所以强制关 ...
- Codeforces Round #441 (Div. 2, by Moscow Team Olympiad) B. Divisiblity of Differences
http://codeforces.com/contest/876/problem/B 题意: 给出n个数,要求从里面选出k个数使得这k个数中任意两个的差能够被m整除,若不能则输出no. 思路: 差能 ...
- xpath的一般用法与特殊用法
# xpath的使用 安装lxml from lxml import etree Selector = etree.HTML(网页代码) Selector.xpath(一段神奇的代码) xpath的一 ...
- 最短路径之Dijkstra算法
Dijkstra(迪杰斯特拉)算法是典型的最短路径路由算法,用于计算一个节点到其他所有节点的最短路径.主要特点是以起始点为中心向外层层扩展,直到扩展到终点为止.Dijkstra算法能得出最短路径的最优 ...
- PAT 1082. 射击比赛 (20)
本题目给出的射击比赛的规则非常简单,谁打的弹洞距离靶心最近,谁就是冠军:谁差得最远,谁就是菜鸟.本题给出一系列弹洞的平面坐标(x,y),请你编写程序找出冠军和菜鸟.我们假设靶心在原点(0,0). 输入 ...