Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.06.2016, 16:04
Аспирант
Отправить личное сообщение для piraids Посмотреть профиль Найти все сообщения от piraids
 
Регистрация: 20.08.2013
Сообщений: 88

Простые часы
Буду благодарен за помощь в понимании замыкания не стандартного
собственно хочу написать простой скрипт часов
<!DOCTYPE html>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
$(document).ready(function(){

jQuery.fn.digitalWatch = function() {
  
  var el = $(this),
  		clock = this,
  		init = function(){
        var date = new Date();
        var hours = date.getHours();
        var minutes = date.getMinutes();
        var seconds = date.getSeconds();
        if (hours < 10) hours = "0" + hours;
        if (minutes < 10) minutes = "0" + minutes;
        if (seconds < 10) seconds = "0" + seconds;
        el.html( hours + ":" + minutes + ":" + seconds );
      };
  
  
      init();
  
}

$('#clock').digitalWatch();

});
  </script>
</head>

<body>
<div id="clock"></div>
</body>
</html>


пытаюсь его заставить работать, но пока что тщетно

<!DOCTYPE html>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
$(document).ready(function(){

jQuery.fn.digitalWatch = function() {
  
  var el = $(this),
  		clock = this,
  		init = function(){
        var date = new Date();
        var hours = date.getHours();
        var minutes = date.getMinutes();
        var seconds = date.getSeconds();
        if (hours < 10) hours = "0" + hours;
        if (minutes < 10) minutes = "0" + minutes;
        if (seconds < 10) seconds = "0" + seconds;
        el.html( hours + ":" + minutes + ":" + seconds );
      };
  
  
  	setTimeout(function(){
    	(function(newClock){newClock.init()})(clock);
    }, 1000);
  
}

$('#clock').digitalWatch();

});
  </script>
</head>

<body>
<div id="clock"></div>
</body>
</html>
Ответить с цитированием
  #2 (permalink)  
Старый 30.06.2016, 16:15
Аспирант
Отправить личное сообщение для piraids Посмотреть профиль Найти все сообщения от piraids
 
Регистрация: 20.08.2013
Сообщений: 88

все решил проблему так:

jQuery.fn.digitalWatch = function() {
  
  var el = $(this),
  		clock = this,
  		init = function(){
        var date = new Date();
        var hours = date.getHours();
        var minutes = date.getMinutes();
        var seconds = date.getSeconds();
        if (hours < 10) hours = "0" + hours;
        if (minutes < 10) minutes = "0" + minutes;
        if (seconds < 10) seconds = "0" + seconds;
        el.html( hours + ":" + minutes + ":" + seconds );
        
        setTimeout(function(){
          init();
        }, 1000);
      };
  
  
  	init();
    
  
}

$('#clock').digitalWatch();
Ответить с цитированием
  #3 (permalink)  
Старый 30.06.2016, 17:10
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,075

piraids,
<!DOCTYPE html>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
$(function() {
    jQuery.fn.digitalWatch = function() {
        function formatTime(num)
      {
         return ("0" + num).substr(-2)
      }
        this.each(function(i, el) {
            var el = $(el),
                init = function() {
                    var date = new Date,
                        hours = date.getHours(),
                        minutes = date.getMinutes(),
                        seconds = date.getSeconds();
                    hours = formatTime(hours);
                    minutes = formatTime(minutes);
                    seconds = formatTime(seconds);
                    el.html(hours + ":" + minutes + ":" + seconds);
                    setTimeout(init, 1000)
                };
            init()
        });
        return this
    };
    $(".clock").digitalWatch().css({
        color: "red"
    })
});
  </script>
</head>

<body>
<div class="clock"></div> <div class="clock"></div>
</body>
</html>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
часы для сайта помогите собрать bulkashev Ваши сайты и скрипты 0 30.07.2013 11:50
Часы сервера на javascript и php NexXT Общие вопросы Javascript 3 14.03.2013 15:05
Не работают Часы Dimanchik87 Events/DOM/Window 2 08.03.2013 03:04
Цифровые часы с "будильником" Aleksanderac Общие вопросы Javascript 1 08.12.2009 22:48
аналоговые часы v4567 Ваши сайты и скрипты 4 06.06.2009 19:00