简单的JS控制button颜色随点击更改
先上效果图:
默认“今日”是选中状态,是行内样式:
- <button type="button" id="today" class="btn-link" onclick="todayDate()" style="color: #0062CC;">今日</button>
上面的日期都是点击才会切换颜色:
- 点击其它颜色,“今日”颜色更换成灰色
- 再次点击“今日”,还原回默认状态颜色
- 在除“今日”外的其它任一个日期中添加一个点击事件,可以实现【改变“今日”默认颜色状态】
- 在“今日”的点击事件中添加【还原‘‘今日’’的默认状态颜色】
- //昨日click
- function yesterdayDate() {
- document.getElementById('title').value = getYesterdayDate(new Date());
- fetYesterdayData();
- today.css('color','#555555');
- }
- //今日click
- function todayDate() {
- document.getElementById('title').value = formatterDateStr(new Date());
- fetTodayData();
- today.css('color','#0062cc');
- }
OK,完成
简单的JS控制button颜色随点击更改的更多相关文章
- js控制div颜色
<html><head></head><style>#div1{width:400px;height:400px;background-color:re ...
- js控制button
按钮变灰不可用方法:document.getElementById("crop").setAttribute("disabled", true); 按钮可用方法 ...
- 通过JS控制各种元素的点击事件的【时间间隔】,特别适合【发表评论】功能
1.使用情景模拟:下单(防止用户无脑狂点).支付(防止用户无脑点击支付).发表评论(防止用户无脑点击),当然如果你用了一个提示框进行屏蔽,下面代码可以无视了,右上角谢谢. 2.默写情景比如:比如发表评 ...
- JS控制的事件
鼠标点击弹出提示事件: <input type="button" value="鼠标点击弹出提示" onclick="DianJi()" ...
- js控制页面显示和表单提交
早期的web页面在显示方面一般在后台进行控制,虽然对后台开发来讲是比较容易做到的,但是涉及到一个问题,那就是数据库压力. 因为要控制显示,所以会比较频繁的从数据库中来回调用. 现在的js功能越来越强, ...
- js控制页面的全屏展示和退出全屏显示
<!DOCTYPE html> <html> <meta http-equiv="Content-Type" content="text/h ...
- js控制TR的显示影藏
在很多现实的场景中,有的文本框我们希望在选择“是”的按钮之后才出现,这就需要js控制TR的隐藏和显示,(div的影藏显示类似) 以下是一段选择是的按钮就显示身高和体重的文本框的代码.注意:ready方 ...
- js控制父子页面传值(iframe和window.open)
在html中,window对象代表浏览器中一个打开的窗口,就像我们C/S中做窗体一样,在该页的window对象就是new了一个新的窗体对象. 就像做C/S开发一样,浏览器是一个软件,每一个网页都是它n ...
- 使用JS控制伪元素的几种方法
一. 缘由: 本文源于在OSC社区中,有人提问如何用jq获取伪元素.我第一想法是强大的CSS Query应该可以获取伪元素吧. 然而事实上,CSS Query并不能.即我们不能通过$(":b ...
随机推荐
- Unity3D中的预制件(Prefab)的创建和使用说明!!!
首先我说明一下什么预制件? 在U3D里面我们叫它Prefab:我们可以这样理解:当制作好了游戏组件(场景中的任意一个gameobject),我们希望将它制作成一个组件模版,用于批量的套用工作,例如说场 ...
- SWT使用注意点
出现这个错: java.lang.UnsatisfiedLinkError: no swt-win32-3139 in java.library.path 解决方法: 将swt-win32-3139导 ...
- poj2531 Network Saboteur
Network Saboteur Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 11122 Accepted: 5372 ...
- session 安全相关
有一点我们必须承认,大多数web应用程序都离不开session的使用.这篇文章将会结合php以及http协议来分析如何建立一个安全的会话管理机制.我们先简单的了解一些http的知识,从而理解该协议的无 ...
- SQL Server 查询性能优化 相关文章
来自: SQL Server 查询性能优化——堆表.碎片与索引(一) SQL Server 查询性能优化——堆表.碎片与索引(二) SQL Server 查询性能优化——覆盖索引(一) SQL Ser ...
- 将函数传给webworker
var zWorker = function (func,cb){ var node = document.createElement('script'),workerId='worker' + Da ...
- (原创)在Exchange 2007 server中使用实时黑名单服务(RBL)过滤垃圾邮件
近一段有同事抱怨公司的邮件系统垃圾邮件非常多,早上上班打开邮箱垃圾邮件竟然有几十封.然后赶紧打开Exchange工具“邮件跟踪”,发现有每隔1到2分钟,邮件系统便会收到来自不同IP的垃圾邮件,由于源I ...
- Word中的字体大小
Word中的字体大小(几号-几磅) Word对字体大小采用两种不同的度量单位,其中一种是以"号"为度量单位,如常用的"初号.小初.一号.小一--七号.八号" ...
- swifttextfield代理方法
//MARK:textfield delegate //键盘的高度 func textFieldShouldBeginEditing(textField: UITextField) -> Boo ...
- Theano2.1.8-基础知识之装载和保存
来自:http://deeplearning.net/software/theano/tutorial/loading_and_saving.html loading and saving Pytho ...