Javascript 世界时钟仅显示在表中

2023-12-12

我试图显示世界各地几个不同城市的时间,我已经搜索和谷歌,甚至使用了这里找到的答案:PHP 或 JavaScript 中的世界时钟 API,但时钟只会显示在表格中。我使用了这个网站的教程:http://www.proglogic.com/code/javascript/time/worldclock.php(除其他外。这似乎是最直接的。)。

我试图让它显示在我的导航栏中,类似于此页面:https://www.blackcard.com/,所以桌子似乎不是一个可行的方法。当然,我可能是错的。

另外,我正在使用 Bootstrap,如果这很重要的话。

如果大家有什么想法请告诉我。

Thanks!


我会用moment.js为了这

你将需要这两个文件:

http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.3/moment.min.js http://momentjs.com/downloads/moment-timezone-with-data.min.js

使用 moment.js,您可以执行以下操作:

html:

<div id="myCoolNavBarr"></div>

javascript

//create a "moment" object from the current date/time
//use the timezone functionality to to set the timezone of the "moment"
//specify the format to display just the time 
var newYork = moment.tz("America/Los_Angeles").format("h:mm: A");
var london = moment.tz("Europe/London").format("h:mm: A");
var hongKong = moment.tz("Asia/Hong_Kong").format("h:mm: A"); 
var tokyo = moment.tz("Asia/Tokyo").format("h:mm: A");


//put them to use 
$("#myCoolNavBarr").append("NY  "+newYork+ " --- LDN  " +london+ " --- HK  " +hongKong+ " --- TYO  " +tokyo)

这是一个工作JsFiddle

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Javascript 世界时钟仅显示在表中 的相关文章

  • jQuery:查找具有特定自定义属性的元素

    我只想找到具有特定自定义属性值的元素 例如 我想找一个div其具有属性data divNumber 6 var number 6 var myDiv data divNumber number 我尝试使用http api jquery co
  • Javascript 将对象推送为克隆

    我将 d3 用于交互式网络应用程序 我需要绑定的数据在交互过程中发生变化 并且由 JSON 变量中的一些选定对象组成 为此 我在 JSON 变量上使用了映射 并进行了一些查询来选择适当的对象 对象被推送到列表中 并且该列表被绑定为新数据 我
  • 判断字符串是否包含有效的javascript代码

    我正在寻找一个C 返回的函数true如果字符串包含有效的 JavaScript 语法 例如 IsValidJavascript alert hello 会回来true but IsValidJavascript alertXXhelloZ
  • Angular UI 路由器嵌套视图问题

    我在理解 Angular UI Router 嵌套视图的工作原理时遇到了一些问题 我的 stateProvider 看起来像这样 stateProvider state login url login views main template
  • Apache Thrift Java-Javascript 通信

    我正在编写一个基于 Apache Thrift 的 Java 服务器 它将从 Javascript 客户端接收数据 我已经完成了 Java 服务器 但问题是我可以获得 Javascript 客户端的工作示例 我无法找到一个好的示例 构建文档
  • 正则表达式中连字符的这种用法有效吗?

    NB I only想知道它是否是正则表达式定义中未转义连字符的有效应用 它是not关于匹配电子邮件 连字符或反斜杠的含义 量词或其他任何内容的问题 另外 请注意 链接的答案并没有真正讨论转义 未转义连字符之间的有效性问题 通常我会像这样声明
  • 通过 JavaScript 单击按钮/页面提交

    我想了解 asp net 框架如何知道何时单击了按钮 因此一旦收到请求 就会在服务器上触发其单击事件 我需要了解它是如何工作的 因为我想从 JavaScript 触发按钮的服务器单击事件 我能够从 JavaScript 执行页面提交 doc
  • Bootstrap 4 移动导航栏消失

    我刚刚从 Bootstrap 3 转换为 Bootstrap 4 但我的移动导航栏出现问题 使用切换按钮展开导航栏时 导航消失 我不明白为什么会发生这种情况 导航栏下方有一个大屏幕 但整个移动导航向上移动 如下面的 gif 所示 以下是导航
  • jquery 中的函数返回未定义[重复]

    这个问题在这里已经有答案了 我在 jquery 中调用的函数返回未定义 我检查了该函数 当我对其进行调试时 它返回正确的数据 function addToPlaylist component type add to pl value pl
  • bootstrap3 缩略图网格

    I find a tutorial about bootstrap grid but it was written in bootstrap1 x Now I want to use bootstrap3 to achieve the sa
  • Angular 4 Http POST 不起作用

    我希望每个人都做得很好 我最近开始使用 Angular 4 4 我一直在尝试将数据发布到我的 api 服务器 但不幸的是它不起作用 我花了大约两天的时间 但仍然没有成功 甚至已经尝试过 6 7 篇文章角 io https angular i
  • 可以禁用幻灯片的触摸模拟但不能禁用滚动条(危险的滑动器)吗?

    我的页面上有一个危险的滑动器 它成功地模拟了幻灯片和随附滚动条上的触摸事件 允许单击鼠标并移动以向左或向右滑动幻灯片 这很好 但我现在在滑动器内的幻灯片上调用了可拖动 这意味着我需要停止此触摸模拟 拖动幻灯片并同时移动它们会引起混乱 但仅限
  • ES6 模块范围

    我有代码 lib js var a a export var b b main js console log a a variable is not available in a global scope import b from lib
  • 如何在React中动态分配属性?

    这是一个有两个参数的函数 我要创建的标签的名称 具有以下属性的对象 Using React 我创建一个组件并将该元素渲染到 DOM 问题是我想向元素添加属性 但它不允许循环在元素内设置属性 var Element function elem
  • Svelte 条件元素类报告为语法错误

    我正在做一个if块每if 块的精简指南 https svelte technology guide if blocks 这看起来很简单 但 Svelte 认为这是一个语法错误 svelte plugin ParseError Unexpec
  • 了解 Document.createElement()

    我在用着GWT及其底层DOM能力 我基本上想要实现的是 Have a div包含一些文本的元素 其中一些文本将被包围span元素 span 元素可相互拖动并提供上下文菜单 New span元素可以由最终用户动态创建 它可能是这样的 在应用程
  • 如何将MathJax公式转换为img

    Mathjax 现在在我的项目中运行良好 但有一个问题 有没有办法将MathJax的公式 纯html和css 转换成img文件 我可以保存 MathJax 可以配置为生成 SVG 看http docs mathjax org en late
  • 如何在 TypeScript 中使用 navigation.replace ?

    我试图在我的代码中使用它 const navigation useNavigation navigation replace AllFriends 但我不断收到错误消息 Property replace does not exist on
  • Vue - 调度完成后调用 store getter?

    我正在使用 Laravel 5 7 Vue2 Vuex 我在调度调用完成后让 Vue 返回存储值时遇到一些困难 我的申请流程如下 我单击一个提交按钮 该按钮调用组件上的 validate Validate 分派到我的 addLease 操作
  • JavaScript 阶乘防止无穷大

    我一直在 JavaScript 中使用这个函数来计算阶乘数 var f function factorial n if n 0 n 1 return 1 if f n gt 0 return f n return f n factorial

随机推荐