<!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>

全部 1 2 3 其他

button点击切换,获取按钮ID的更多相关文章

  1. 点击鼠标获取元素ID

    原文:点击鼠标获取元素ID public partial class Form1 : Form { public Form1() { InitializeComponent(); } private ...

  2. Taro button点击切换选中状态

    1.引入组件 2.state中设置选中状态 // button按钮的默认选中,0代表选中 state = { currentIndex: 0 } 3.设置class的样式,点击更改选中 selectN ...

  3. Android Button点击效果(按钮背景变色、文字变色)

    一. 说明 Android Button的使用过程中,我们会需要为Button添加点击效果,不仅仅按钮的背景色需要变化,而且有时,我们连文字的颜色都希望变化,我们可以使用StateListDrawab ...

  4. $工具, 属性, TAB点击切换

    $工具方法 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <tit ...

  5. 利用DOM的方式点击切换图片及修改文字

    本案例主要学习理解,用到的几个DOM方法 01.getAttribute()方法,获取元素的属性值 02.setAttribute('src',source) 方法,用后边的值修改前边这个元素的属性值 ...

  6. Swift - 获取、改变按钮的标题文本(UIButton点击切换title)

    在开发中,我们常常需要动态地改变按钮标签文字,使用 setTitle() 函数就可以了.有时我们需要在几个标题间切换,比如下面样例所示,按钮点击后按钮文字会在"播放""暂 ...

  7. jquery——左右按钮点击切换一组图片功能

    一.最终效果 二.功能分析 1.需求分析 点击左边pre按钮,显示前面三个图片,点击右边的next按钮,显示后面的一组(三个)图片.初始化只显示next按钮,到最后一组只显示pre按钮,中间过程两按钮 ...

  8. 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 ...

  9. .net学习之母版页执行顺序、jsonp跨域请求原理、IsPostBack原理、服务器端控件按钮Button点击时的过程、缓存、IHttpModule 过滤器

    1.WebForm使用母版页后执行的顺序是先执行子页面中的Page_Load,再执行母版页中的Page_Load,请求是先生成母版页的控件树,然后将子页面生成的控件树填充到母版页中,最后输出 2.We ...

随机推荐

  1. 初学者如何查阅自然语言处理(NLP)领域学术资料

    1. 国际学术组织.学术会议与学术论文 自然语言处理(natural language processing,NLP)在很大程度上与计算语言学(computational linguistics,CL ...

  2. Python-socket网络编程-Day8

    目录Day8-Python socket 11.Socket 11.1.socket和file的区别: 11.2.WEB服务应用: 21.3.更多功能 21.4.socket方法: 41.5. 服务端 ...

  3. 查找git ignore的追踪

    前言 版本控制说简单也简单,说复杂也困难的多.作为开发者,最基础的版本管理和团队协作的功能必须掌握.而其他一些相关的信息也可以了解下.比如,这次就有同事遇到了问题. 遇到的问题 在windows下,往 ...

  4. idea找不到package下的mapper.xml文件

    由于开发人员使用不同的开发工具,导致eclipse的开发人员将mapper.xml文件习惯性的放到package下,以便查看,而eclipse编译时,不会忽略package下的xml以及dtl文件,所 ...

  5. python虚拟环境--virtualenv

    virtualenv 是一个创建隔绝的Python环境的工具.virtualenv创建一个包含所有必要的可执行文件的文件夹,用来使用Python工程所需的包. 安装 pip install virtu ...

  6. linux远程传输

    scp scp 命令是 SSH中最方便有用的命令了,scp就是secure copy,是用来进行远程文件拷贝的.数据传输使用 ssh,并且和ssh 使用相同的认证方式,提供相同的安全保证. 与rcp ...

  7. html超文本标记语言的由来

    万维网上的一个超媒体文档称为一个页面:page,作为一个组织或者个人在万维网上放置开始点的页面称为主页:homepage或者首页,主页中通常有指向其他相关页面或者其他节点的指针,就是通常所说的超链接, ...

  8. 0418 jQuery笔记(添加事件、each、prop、$(this))

    1.添加点击事件.each.prop.$(this) //全选框的被动操作 //定义一个标志保存最终状态 var flag = false; //为每一个选择框添加点击事件,数组.click() $( ...

  9. selenium 设置代理的话,可以使用这种方式,代码是我刚才测试过的,亲测可用

    from selenium import webdriver chrome_options = webdriver.ChromeOptions() chrome_options.add_argumen ...

  10. 关于自定义view--实现自定义水波纹效果

    开发中的东西太多,怕自己忘记了,简单记录一下. 声明:此控件借鉴了大佬的想法,在此感谢大佬提供的支持,我只是把大佬的想法拿出来而已. ok,废话到此结束,看效果: 分析一下,我们可以看到,图中有两个圆 ...