На моей странице у меня есть два div … один div, который я хотел бы видеть с 10:00 до 18:00 (время сервера) …. и другой div для оставшихся часов.
Я попробовал кучу поисков, чтобы найти какой-то jap-скрипт для javascript или jQuery без какой-либо удачи .. спасибо за любые предложения?
<div id="day">content</div> <div id="night">content</div> Я смог получить эту работу, используя только следующие php:
<?php $hour = strftime("%H"); if ($hour >= 02 && $hour < 05) { echo '<div id="div1">content block one </div>'; } else { echo '<div id="div2">content block two</div>'; }?>
Однако это решение не работает, если я хочу показать div с 8 вечера до 4 утра … это потому, что он охватывает более одного дня? Спасибо за любые предложения.
Случай, который вы упомянули в своем комментарии, является тернистым. Итак, вот мой пересмотренный пересмотренный ответ:
<?php $t0 = 20; // from hour (inclusive) -- int, 0-23 $t1 = 4; // till hour (excluding) -- int, 0-23 $t = date('G'); // current hour (derived from current time) -- int, 0-23 if ($t0 == $t1) { $in_range = NULL; } elseif ($t0 < $t1) { $in_range = ($t0 <= $t && $t < $t1); } else { $in_range = ($t1 <= $t && $t < $t0) == false; } /* echo $in_range === NULL ? 'from and till dates must be different' : ($in_range ? 'just in time' : 'wait till the time is right'); */ if ($in_range === false) { $s0 = mktime($t0, 0, 0); // lunch time $s = time(); // current time if ($s0 < $s) { $s0 += 60 * 60 * 24; // late for lunch! now wait till tomorrow } $d0 = $s0 - $s; $dh = floor($d0 / 60 / 60); $dm = $d0 - $dh * 60 * 60; $dm = floor($dm / 60); $ds = $d0 - $dh * 60 * 60 - $dm * 60; echo sprintf(" Current date...: %s<br /> Target date....: %s<br /> Time to go.....: %d hours, %d minutes, %d seconds ", date("Ymd h:i:s A", $s), date("Ymd h:i:s A", $s0), $dh, $dm, $ds ); } ?>
Если вам нужно установить видимость на основе времени сервера, вы должны показать и скрыть divs со стороны сервера. Поскольку ни один JavaScript не может получить серверное время, но клиент (возможно удаленный локальный) браузер.
Если у вас есть сценарий на вашем сайте, который может вернуть время сервера, то вы можете это сделать, но я думаю, было бы разумнее пометить код HTML (php, jsp, whatever) условно с нуля.
Просто используйте обработчик $(document).ready() с getHours() метода Date() (например, метод getHours() ), как и со следующим кодом: jsfiddle.net/c2TPZ . Вы можете скрыть оба блока по умолчанию, если только JS не устанавливает стили CSS для них, например. как это:
$('#box1').css({display: 'block'}); // sets display to 'block', eg. from 'none'
Обычно я рекомендую это делать на сервере, но в Javascript он будет выглядеть примерно так:
var pHour = Date.getHours(); if ((pHour >= 10) && (pHour < 18)) { $('.scheduled-target').show(); }
Это предполагает, что вы должны сделать отображение .scheduled-target: none по умолчанию.
Также это касается местного времени клиента. Если вы хотите абсолютное время, вам нужно начать с Date.getUTCHours () и сделать смещения для вашего часового пояса / локали.
$(document).ready(function() { var d = new Date(); if (d.getHours() >= 10 && d.getHours() < 18) { $(#div1).show(); $(#div2).hide(); } else { $(#div1).hide(); $(#div2).show(); } });
EDIT: Ой, я пропустил часть времени сервера. Это не будет надежным. Вместо этого вы должны установить их с помощью серверных скриптов. Не знаете, что вы используете на стороне сервера, но, например, в PHP:
$hour = strftime("%H"); if ($hour >= 10 && $hour < 18) { $div1_class = "show"; $div2_class = "hide"; }
В вашем css класс .hide – display: none;
Теоретически это так просто:
HTML
<div class="h h10-6">10-6</div>
<div class="h h-other">other time of day</div>
JavaScript
current_hour = <? some_server_side_code_to_get_the_hour ?>;
if(current_hour >= 10 && current_hour < 18) $('.h10-6').show();
else $('.h-other').show();
CSS
.h { display: none; }