jquery - 根据日期更改带有 JQuery 的 Div 类

标签 jquery html css zurb-foundation

JQuery 新手,我一辈子都弄不明白。我知道这会很简单。

不能在服务器端执行此操作。

我正在为一位客户开发有关季节性 Yaga 的网站。在入门页面上,每个季节都有 5 个 div。我只希望一个显示取决于任何给定年份的日期。

例如, Spring 是 3 月 1 日至 5 月 31 日(含)。

夏季从那之后开始等等。我还没有得到具体日期。

使用 Foundation 5,所以我将 .hide 附加到每个 div。

因此脚本应该检查日期并从正确季节的 div 中删除 .hide 类。

<div id="winter-panel" class="hide small-12 medium-6 columns">
  <div class="panel">
    <h3>Winter</h3>
    <p>Winter is the water element, a time to flow smoothly and be reflective in our thoughts and in our actions.</p> 
    <p>Natures energy is at it's lowest at 1/5 and the earth seems quieter as vegetation has gone and animals are hibernating - 
            we should do the same: slow down, sleep when you can and conserve energy for the lighter months ahead.</p> 
    <a class="button" href="winter.html">Read more</a>
  </div>
</div>

最佳答案

通过获取当前月份,您可以隐藏或显示您的 div..

    $( document ).ready( function() {
      var now = new Date();
      var currentMonth = now.getMonth();//returns 0-11
      //based on month hide or show your div
      if( currentMonth > 0 && currentMonth < 5 ) {
      $( "#winter-panel").show();
      } 
      else {
      $( "#winter-panel" ).hide();
      }
    });

关于jquery - 根据日期更改带有 JQuery 的 Div 类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20949548/

相关文章:

php - jquery ajax - 更好地返回 json 或纯 html

javascript - Jquery 中按顺序排列的日期名称

javascript - 谷歌地图 API v3 : Passing an Image for symbolPath rather than a inbuilt symbol

jQuery 仅验证复选框/单选框的样式父 div

PHP _GET 问题多次尝试后未刷新数据

javascript - 如何使用 JavaScript 将选定的 HTML 表格行值显示到输入类型单选和复选框中

html - flex 基础示例 : content

javascript - 通过模板和占位符动态生成 CSS

CSS 没有出现在 Inspect Element 中?

html - Flexbox - 在多列中对齐元素基线