jquery数字时钟答案

【问题标题】：jquery digital clockjquery数字时钟
【发布时间】：2013-01-11 17:13:19
【问题描述】：

我正在尝试使用基于此处的示例：http://www.techtricky.com/jquery-code-to-show-time-in-different-countries/

但是我是 JS 新手，遇到了麻烦。我基本上是想让它在没有选择框的情况下显示时间。

然后我将尝试一次显示多个不同的时间。

例如

+------------------+ |晚上 10 点 14 分 14 秒 | | 08:14:14 下午 | |下午 06:14:14 | +------------------+

我意识到 var 选项允许我设置样式和时间偏移。但是功能是我感到困惑的一点。我一直在尝试将#zones 设置为自动运行，但无需选择某些内容就无法启动它。（理想情况下我根本没有选择，我尝试为区域选择设置默认值，但这也不起作用）我认为这是因为该函数具有 $("#zones").change 所以只会在更改时运行。

TIA！

【问题讨论】：

你应该展示你的代码。

标签： javascript clock

【解决方案1】：

你可以做这样丑陋的事显然你可以在一个循环或其他方式中完成它，这样你就不必像我在这里那样编写 3 次代码

另外 - jclock 文档中的示例很少：https://sites.google.com/site/jqueryjclockjs/

    <html>
      <head>
      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
      <script type="text/javascript" src="http://techtricky.com/wp-content/jquery/jquery.jclock.js"></script>
      <script type="text/javascript">
        $(document).ready(
            function() {
           $('#time-cont1').append('<div class="time"></div>');
               var options = {
                format:'<span class=\"dt\">%A, %d %B %I:%M:%S %P</span>',
                timeNotation: '12h',
                am_pm: true,
                fontFamily: 'Verdana, Times New Roman',
                fontSize: '20px',
                foreground: 'black',
                background: 'yellow',
                utc:true,
                utc_offset: 8
              }

              $('#time-cont1 .time').jclock(options);
              $('#time-cont2').append('<div class="time"></div>');
               var options = {
                format:'<span class=\"dt\">%A, %d %B %I:%M:%S %P</span>',
                timeNotation: '12h',
                am_pm: true,
                fontFamily: 'Verdana, Times New Roman',
                fontSize: '20px',
                foreground: 'black',
                background: 'yellow',
                utc:true,
                utc_offset: 6
              }

              $('#time-cont2 .time').jclock(options);
              $('#time-cont3').append('<div class="time"></div>');
               var options = {
                format:'<span class=\"dt\">%A, %d %B %I:%M:%S %P</span>',
                timeNotation: '12h',
                am_pm: true,
                fontFamily: 'Verdana, Times New Roman',
                fontSize: '20px',
                foreground: 'black',
                background: 'yellow',
                utc:true,
                utc_offset: -5
              }

              $('#time-cont3 .time').jclock(options);
         });
        </script>

      </head>
      <body>
        Country1: <div id="time-cont1"></div>
        Country2:  <div id="time-cont2"></div>
        Country3: <div id="time-cont3"></div>
      </body>
    </html>

【讨论】：

【解决方案2】：

您可能对此感兴趣： Raphael - Polar Clock

【讨论】：