Отключить ссылку в пятницу в 4 вечера и включить в воскресенье 7:00

Question

Я пытаюсь использовать немного JavaScript, чтобы получить дату и время, а затем использую некоторый jQuery, чтобы включить / отключить ссылку.

Итак, у меня есть что-то вроде этого,

<a href="link.html" title="Link">
<img src="link.gif" alt="link" />
</a>

И между пятницей в 4 вечера и воскресеньем в 7:00, я бы хотел, чтобы это просто произнесло это,

<img src="link.gif" alt="link">

Как бы я мог это сделать?

PS Я бы предпочел, чтобы ссылка была жестко закодирована, а не была добавлена ​​в JavaScript ...

Answer 1

Вместо удаления тегов привязки () просто отключите его, используя код, подобный этому:

function AGoodTime() {
    var now = new Date();
    var day = now.getDay();
    var hour = now.getHours();
    var IsBadTimeOnFriday = day == 5 && hour >= 16;
    var IsBadTimeOnSaturday = day == 6;
    var IsBadTimeOnSunday = day == 7 && hour <= 7;
    return !IsBadTimeOnFriday && !IsBadTimeOnSaturday && !IsBadTimeOnSunday;
}

$('.GoodTimes').click(function(event) {
    if(!AGoodTime()) {
        event.preventDefault();
    }
});

с HTML, как это:

<a class="GoodTimes" href="http://www.google.com" target="_blank">test link</a>

Answer 2

Проблема с JavaScript будет заключаться в том, что он будет отключен / удален в это время на клиентском компьютере, а не на вашем компьютере. Поэтому, если вы хотите отключить ссылку в тот период времени (скажем, в США), она не будет отключена в то же время в Европе.

Так что лучший способ сделать это - отключить ссылку со стороны сервера.

Альтернативным способом выполнения в JavaScript может быть получение времени или времени сервера из некоторого стандартного местоположения, которое не будет изменяться в зависимости от местоположения пользователя и в зависимости от того, включить или отключить ссылку. Я нашел этот код , чтобы узнать время.

$(document).ready(function(){
  var timezone = "Europe/Berlin";
  $.getJSON("http://json-time.appspot.com/time.json?tz="+timezone+"&callback=?",
    function(data){
      if (data.hour < 12) {
        alert ("Good morning in "+timezone);
      } else {
        alert ("Good afternoon in "+timezone);
      }
    })
});

Теперь вы можете использовать этот код, чтобы показать / скрыть ссылку, создав 2 деления / пролета и отобразив один в зависимости от вашего времени.

Обновление
Вот рабочий пример метода, который я только что упомянул. http://jsfiddle.net/pkDNX/

Вам придется настроить код в соответствии с вашим часовым поясом и условиями if.

Обновление : Вот рабочий пример для ваших требований. http://jsfiddle.net/pkDNX/1/

Answer 3

Прежде всего, я должен сказать, что это больше похоже на работу на стороне сервера.

что-то вроде (псевдокод)

if shouldDisplayLink
 echo "<a ... <img ... </a> "
else
 echo "<img ... />"

но если требуется решение JS, вы можете выполнить следующие jquery. Создать 2 дел. Давайте назовем один «со ссылкой», а другой - без ссылки. Проверьте, является ли время до или после, и затем вызовите «hide» на том, который вы не хотите отображать. это будет выглядеть примерно так:

<div id="withlink">
    <a href="http://steps.mograbi.info">
       <img src="http://steps.mograbi.info/images/steps-logo.png?1321507410" alt="steps"/> 
    </a>
</div>

<div id="withoutlink">
    <img src="http://steps.mograbi.info/images/steps-logo.png?1321507410" alt="steps"/>
</div>
<script type="text/javascript">
    $(function(){
        var d = new Date();

        if (( d.getDay() == 5 && d.getHours() > 16 ) ||
            ( d.getDay() == 0 && d.getHours() < 7 ))
        {
            console.log("hiding with link");
            $("#withlink").hide(0);
        }

        console.log("hiding without link");
        $("#withoutlink").hide(0);
    })
</script>

дайте мне знать, если что-то мне нужно добавить / изменить.

Answer 4

вот рабочая версия http://jsbin.com/ahitiv/9/edit#source

function ShowHide()
{
  var d = new Date();
  var dayofweek = d.getDay();
  var hourofday = d.getHours();
  if ((dayofweek === 0 && hourofday <= 7) || dayofweek === 6 || (dayofweek === 5 &&     hourofday >= 16)) 
  {
    $("#hello a").click(function(e){
    e.preventDefault();});
  }

}



$(document).ready(function(){

    ShowHide();

});

Answer 5

что-то вроде:

// caching the time variables.
var today = new Date();
var d = today.getDay();
var h = today.getHours();

if (d == 6 || (d ==5 && h>16) || (d == 0 && h < 7)) {
   $('a').click(function(e){
   e.preventDefault(); #prevent the link from working, without hiding it..
});
}

Answer 6

Решение javascript, которое перемещает изображение из ссылки и удаляет ссылку, когда дата находится в указанном диапазоне:

var d = new Date();
var doDisable = (d.getDay() == 5 && d.getHours() >= 16) || d.getDay() == 6 || (d.getDay() == 0 && d.getHours() < 7);
if (doDisable) {
  $('#link img').insertBefore('#link');
  $('#link').remove();
}

Поместите это в jQuery-DOM-Ready-Loader. Вот jsfiddle .

Как отметил @Origin, это не мешает пользователю получить доступ к связанному URL, а только скрывает ссылку в браузерах с поддержкой javascript.