jquery - 根据时间改变按钮的颜色

标签 jquery html css

我想根据轮类时间更改按钮的颜色。同样,如果是早类,按钮颜色应该是蓝色,而在晚上它应该自动变为红色或任何不同的颜色。我需要四种不同的颜色。谁能帮我解决这个问题?

$(document).ready(function(){
  $("#hex").on('change', function(){  
    var hex = $("#hex").val();
    $("#btn").css({"background-color":hex});
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="hex" />
<input type="button" id="btn" />

最佳答案

下面是可以帮助您的示例代码。只需从 Date() 获取小时数,使用 if-else 条件或 switch-case 并添加您想要的颜色:

$(document).ready(function() {
  var hours = new Date().getHours();
  var color = '#d00';
  if (hours < 12)
    color = '#FFF';
  else if (hours > 12 && hours < 15)
    color = '#000';
  $("#btn").css({
    "background-color": color
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="hex" />
<input type="button" id="btn" />

关于jquery - 根据时间改变按钮的颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44924616/

相关文章:

javascript - 获取表javascript的行索引

jquery - 在 Razor 的 Javascript 中嵌入 Html.ActionLink

html - 无法在 Bootstrap 3 中将标签与文本框居中对齐

javascript - Winnovative HTML 到 PDF 转换器

html - css 样式字段集

javascript - 检测用户设备并在 js/jquery 中分配不同的 jquery(桌面/移动(ipad))?

javascript - 根据切换更改按钮值

html - 有效的 CSS/HTML 有什么意义?

javascript - 如何在html中添加侧边栏菜单?

javascript - 转换被添加......无休止