根据日期更改链接等级

我在我们的网站上获得了一个菜单列表，当前一周的菜单中突出显示了不同的颜色背景，该背景由该项目上的“当前”类决定。
目前我每周都要手动更改这个类，但是想知道是否有一些我可以设置的内容会根据我给出的日期自动更改类。根据日期更改链接等级

<div id="corsham-menu" class="content"> 
<ul> 
<li class="menus6"><h5>Menu</h5><a href="#/corsham/A.pdf">A</a></li> 
<li class="menus6"><h5>Menu</h5><a href="#/corsham/B.pdf">B</a></li> 
<li class="menus6 current"><h5>Menu</h5><a href="#/corsham/C.pdf">C</a></li> 
<li class="menus6"><h5>Menu</h5><a href="#/corsham/D.pdf">D</a></li> 
<li class="menus6"><h5>Menu</h5><a href="#/corsham/E.pdf">E</a></li> 
<li class="menus6"><h5>Menu</h5><a href="#/corsham/F.pdf">F</a></li> 
</ul> 
</div> <!-- End of Corsham menu --> 

<div id="weston-menu" class="content"> 
<ul> 
<li class="menus4"><h5>Menu</h5><a href="#/weston/A.pdf">A</a></li> 
<li class="menus4 current"><h5>Menu</h5><a href="#/weston/B.pdf">B</a></li> 
<li class="menus4"><h5>Menu</h5><a href="#/weston/C.pdf">C</a></li> 
<li class="menus4"><h5>Menu</h5><a href="#/weston/D.pdf">D</a></li> 
</ul> 
</div> <!-- End of Weston menu -->

依此类推。将欣赏任何提示是否通过JQuery，PHP或其他解决方案...

来源

2010-08-07 James

你的日期在哪里？ – NullUserException 2010-08-07 13:05:42

此刻没有日期。这一周的日期并不重要，只是当前班级每周开始移动到下一个列表项目等，然后在到达列表末尾时移回列表顶部。 – James 2010-08-11 20:32:28

最简单，最直接的（但不是必需的最优雅的）的选项，是使用PHP的日期（ 'W'）和模数运算符。基本上，你需要将以下添加到每个菜单项的类

<?php if(date('W') % <TOTAL NUMBER> == <ITEM>) echo 'current' ?>

例如，对于“科斯罕菜单”的总数将是6和项目将被从0到5，所以代码需要像

<li class="<?php if(date('W') % 6 == 0) echo 'current' ?> "> Menu A 
<li class="<?php if(date('W') % 6 == 1) echo 'current' ?> "> Menu B 
<li class="<?php if(date('W') % 6 == 2) echo 'current' ?> "> Menu C 
<li class="<?php if(date('W') % 6 == 3) echo 'current' ?> "> Menu D 
<li class="<?php if(date('W') % 6 == 4) echo 'current' ?> "> Menu E 
<li class="<?php if(date('W') % 6 == 5) echo 'current' ?> "> Menu F

ps真的很好的网站，你有！））

来源

2010-08-07 13:10:34 user187291

感谢您的Stereofrog。现在，很抱歉，但你必须在这里稍微引导我。我已经实现了这一点，但你能否为我清除这个问题。这会将“当前”课程每周正确地轮换到下一个项目吗？目前它已在每个列表上选择一个看似随机的选择作为“当前”类。我该如何设置本周应该是最新的起始列表项目？哇，希望有道理。这里有一个当前链接（减去CSS清洁） http://images.snapdragonsnursery.com/html/menus/menu-selector.php – James 2010-08-11 20:22:29

其实，我可能已经明白了。但是如果你能确认这一切都可以，我们将不胜感激。我只是简单地旋转项目编号，以便在某些列表中它会变为2,3,0,1，而不是按数字顺序排列。正确的项目现在突出显示。那么你会认为这会继续起作用吗？ – James 2010-08-11 20:43:49

太棒了 - 感谢您的帮助。 – James 2010-08-12 07:37:11

关于html代码在每个li中打开php标签并使用if语句。如果本周回声电流

来源

2010-08-07 12:59:40 Sotiris

http://www.tizag.com/javascriptT/javascriptdate.php

试着写使用JavaScript中的.getDay（）的函数。你也不得不使用类名称为数字.. 0 =星期日，1 =星期一，等

function menuDate() { 
    var currentDay = currentTime.getDay(); 
    if ($(li).hasClass(currentDay)){ 
    $(li).addClass('current').removeClass('notcurrent'); 
    } 

.notcurrent { 
display: none; 
} 

.current { 
display: list-item; 
}

来源

2010-08-07 13:05:27

本来可以[编辑你以前的答案]（http://stackoverflow.com/posts/3430520/edit），而不是删除它并提交一个新的。 – Gordon 2010-08-07 13:06:51

我会强烈避免使用Javascript进行这种简单的静态操作。 PHP可以完成这项工作，更容易，更广泛的受众... – Harmen 2010-08-07 13:10:45

下面是一个用javascript/jQuery编写的简单演示，用于计算当前星期编号并突出显示与当前星期编号具有相同标识的列表项。它应该作为一个开始，让你走上你想要的功能。

 
<html> 
<head> 

<!-- jQuery library - I get it from Google API's --> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 

<script type="text/javascript"> 
<!-- Function for calculating the week number --> 
Date.prototype.getWeek = function() { 
    var determinedate = new Date(); 
    determinedate.setFullYear(this.getFullYear(), this.getMonth(), this.getDate()); 
    var D = determinedate.getDay(); 
    if(D == 0) D = 7; 
    determinedate.setDate(determinedate.getDate() + (4 - D)); 
    var YN = determinedate.getFullYear(); 
    var ZBDoCY = Math.floor((determinedate.getTime() - new Date(YN, 0, 1, -6))/86400000); 
    var WN = 1 + Math.floor(ZBDoCY/7); 
    return WN; 
} 

<!-- The jQuery code --> 
$(function(){ 
    var today = new Date(); 
    var weekno = today.getWeek(); 

    $("li#" + weekno).addClass("current"); 

}); 

</script> 

<style> 
li.current { 
    font-weight: bold; 
    color: #ff0000; 
} 
</style> 

</head> 
<body> 

<ul id="myWeekList"> 
<li id="29">Week 29</li> 
<li id="30">Week 30</li> 
<li id="31">Week 31</li> 
<li id="32">Week 32</li> 
<li id="33">Week 33</li> 
<li id="34">Week 34</li> 
<li id="35">Week 35</li> 
<li id="36">Week 36</li> 
</ul> 

</body> 

</html>

问候，托马斯·卡恩

来源

2010-08-07 13:17:46 tkahn

不要使用Javascript功能来解决这个...使用PHP！让我给你这个动态的解决方案：

<?php 
    // Menu structure 
    $menu = array(
    'A' => array('weekNo' => 0, 'url' => '#/corsham/A.pdf', 'title' => 'Menu'), 
    'B' => array('weekNo' => 1, 'url' => '#/corsham/B.pdf', 'title' => 'Menu'), 
    'C' => array('weekNo' => 2, 'url' => '#/corsham/C.pdf', 'title' => 'Menu') 
); 

    // Get week number in range, in this example, 0-2 
    $weekNo = date('W') % count($menu); // Get week number 

    // Show the menu 
    echo '<ul>'; 
    // Iterate over each menu item 
    foreach($menu as $label=>$item){ 
    echo '<li class="menus6' . ($item['weekNo'] == $weekNo ? ' current' : '') . '"><h5>' . $item['title'] . '</h5><a href="' . $item['url'] . '">' . $label . '</a></li>'; 
    } 
    echo '</ul>'; 
?>

来源

2010-08-07 13:22:39 Harmen

根据日期更改链接等级

回答

相关问题