首页 > web前端 > js教程 > JS控制button按钮颜色随点击更改的实现方法

JS控制button按钮颜色随点击更改的实现方法

巴扎黑
发布: 2018-05-22 11:51:31
原创
6091 人浏览过

下面小编就为大家带来一篇简单的JS控制button颜色随点击更改的实现方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

先上效果图:

默认“今日”是选中状态,是行内样式:

<button type="button" id="today" class="btn-link" onclick="todayDate()" style="color: #0062CC;">今日</button>
登录后复制

上面的日期都是点击才会切换颜色:

点击其它颜色,“今日”颜色更换成灰色

再次点击“今日”,还原回默认状态颜色

在除“今日”外的其它任一个日期中添加一个点击事件,可以实现【改变“今日”默认颜色状态】

在“今日”的点击事件中添加【还原‘‘今日''的默认状态颜色】

//昨日click
function yesterdayDate() {
  document.getElementById(&#39;title&#39;).value = getYesterdayDate(new Date());
  fetYesterdayData();
  today.css(&#39;color&#39;,&#39;#555555&#39;);
}
//今日click
function todayDate() {
  document.getElementById(&#39;title&#39;).value = formatterDateStr(new Date());
  fetTodayData();
  today.css(&#39;color&#39;,&#39;#0062cc&#39;);
}
登录后复制

OK,完成

以上是JS控制button按钮颜色随点击更改的实现方法的详细内容。更多信息请关注PHP中文网其他相关文章!

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板