使用 javascript 检测用户的机器使用的是 12 小时制(上午/下午)还是 24 小时制(军事时间)
Detect with javascript if user's machine is using 12 hour clock (am/pm) or 24 clock (military time)
是否可以检测用户的机器使用的是 12 小时制(上午/下午)还是 24 小时制(军事时间)?
一种方法是检查用户区域设置,但这只是大量的区域设置比较列表,来自美国的人想要 12 小时制时钟可以只向我发送 en locale,而不是US_en,我无法知道她的偏好。同时,来自美国的某人可能会将她的机器设置为使用 12 小时制格式,并且不想要 12 小时制。
编辑:
date.toLocaleTimeString();
正如用户Mouser在下面建议的那样,理论上可以工作,但不幸的是,它在WebKit浏览器上被窃听(在Chrome和Windows上的新Opera上进行了测试),并且由于某种原因总是返回上午/下午时间。
示例:http://jsfiddle.net/sjuaL3p4/
所以我想我必须改写我的问题,如果有人知道如何在 webkit 浏览器上完成它。
您可以使用国际化 API 和resolvedOptions
来确定hourCycle
:
const locale = navigator.language
Intl.DateTimeFormat(locale, { hour: 'numeric' }).resolvedOptions().hourCycle // ?
Intl.DateTimeFormat('en-US', { hour: 'numeric' }).resolvedOptions().hourCycle // h12
Intl.DateTimeFormat('en-GB', { hour: 'numeric' }).resolvedOptions().hourCycle // h23
此解决方案适用于大多数浏览器,但 Chrome 中存在错误。
var date = new Date(Date.UTC(2012, 11, 12, 3, 0, 0));
var dateString = date.toLocaleTimeString();
//apparently toLocaleTimeString() has a bug in Chrome. toString() however returns 12/24 hour formats. If one of two contains AM/PM execute 12 hour coding.
if (dateString.match(/am|pm/i) || date.toString().match(/am|pm/i) )
{
//12 hour clock
console.log("12 hour");
}
else
{
//24 hour clock
console.log("24 hour");
}
解决方法铬;概念验证
对于Chrome来说,这是一个丑陋的解决方法。它通过reverse geolocation
嗅出用户country_code
。该代码与使用 12 小时制的国家/地区的数组进行检查。这个解决方案很丑陋,因为您需要用户权限才能获取地理位置数据,如果用户的区域设置不同,它将提供错误的信息,但会为您提供用户的国家/地区。我强烈建议不要使用这个例子。这纯粹是为了灵感目的。我编造它作为概念证明。
function getClockChrome() {
navigator.geolocation.getCurrentPosition(function(pos) {
var url = "http://nominatim.openstreetmap.org/reverse?format=json&lat="+pos.coords.latitude+"&lon="+pos.coords.longitude+"&addressdetails=1&accept-language=en_US&json_callback=chromeClockCallBack";
var script = document.createElement('script');
script.src = url;
document.body.appendChild(script);
},
function()
{
//no access to location
},
{
enableHighAccuracy: true,
timeout: 5000,
maximumAge: 0
}
);
}
getClockChrome();
var dateCountryCode = ['US', 'GB', 'PH', 'CA', 'AU', 'NZ', 'IN', 'EG', 'SA', 'CO', 'PK', 'MY'];
function chromeClockCallBack(data)
{
//Request succeeded
if (dateCountryCode.indexOf(data.address.country_code.toUpperCase()) > -1)
{
alert("12 hour clock");
}
else
{
alert("24 hour clock");
}
}
toLocaleTimeString
应该以反映用户偏好的格式给出时间,但它是不可靠的。
我使用的是 Debian 系统。locale
的输出为:
LANG=en_US.utf8
LANGUAGE=
LC_CTYPE="en_US.utf8"
LC_NUMERIC="en_US.utf8"
LC_TIME="en_US.utf8"
LC_COLLATE="en_US.utf8"
LC_MONETARY="en_US.utf8"
LC_MESSAGES="en_US.utf8"
LC_PAPER="en_US.utf8"
LC_NAME="en_US.utf8"
LC_ADDRESS="en_US.utf8"
LC_TELEPHONE="en_US.utf8"
LC_MEASUREMENT="en_US.utf8"
LC_IDENTIFICATION="en_US.utf8"
LC_ALL=
以下是一些date
实验:
$ date +%X
05:23:32 PM
$ LANG=en_GB date +%X
17:24:06
$ LC_TIME=en_GB date +%X
17:24:22
%X
格式告诉date
根据区域设置输出时间。上面的结果与预期完全一致。设置 LC_TIME
是一种仅更改时间格式但保持区域设置中其他所有内容不变的方法。因此,美国的某个人可以使用 24 小时时间格式,即使 en_US
的默认值为 12。
我已经在我的系统上尝试了Mouser的脚本:
$ firefox --no-remote
[Shows a time in the 12 hour format, as expected.]
$ LANG=en_GB firefox --no-remote
[Shows a time in the 24 hour format, as expected.]
目前为止,一切都好。然而
$ LC_TIME=en_GB firefox --no-remote
[Shows a time in the 12 hour format, this is wrong!]
我在Chrome上得到了相同的结果。似乎火狐和铬都忽略了LC_TIME
。
除了永远不应该这样做之外,即使.toLocaleTimeString()
确实可以跨浏览器工作,也不会是一个好的解决方案。它按照用户计算机设置的格式返回一个时间字符串,但可以有一个仍显示 AM/PM 的 24 小时制时钟,以及一个不显示 AM/PM 的 12 小时制时钟。准确或可靠地检测这一点是不可行的。
这条简单的线似乎对我有用。
var is24 = ((new Date(2014, 01, 01, 15, 0, 0, 0)).toLocaleTimeString().indexOf("15") > -1);
虽然它仍然无法在Chrome中工作(适用于IE和Firefox)
这在Chrome中对我有用。我使用了@Mouser中选择的答案,该答案在 Chrome 中不起作用。
let result = false;
const date = new Date();
const dateString = date.toLocaleTimeString(language, {
timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone,
timeStyle: 'short'
});
if (dateString.match(/am|pm/i) || date.toString().match(/am|pm/i)) {
result = true;
}
else {
result = false;
}
- 内部分区字体大小获胜'调整浏览器窗口大小时不会随媒体查询而更改
- 调整窗口大小时,可拖动的对象会出现在容器外部
- Firebase迁移-简单的Firebase.set没有'不再工作了——旧的还是新的
- chrome扩展:尽管运行了at:documentidle,js脚本还是过早启动
- 我应该使用Ng提交还是点击表格
- 用每小时的差值填充数组/列表-从下拉列表中给定两个时间值
- 如何在iOS应用程序中从Firebase中删除超过6小时的数据
- 在javascript中确定输入数字是负数还是正数
- IE在将字符串转换为日期时从日期中删除4小时
- 我应该先学习Angularjs还是Laravel
- 调整屏幕大小时更改属性值
- 将直流图表库中的折线图缩放限制为小时
- 我需要NG-IF/NG-SWITCH还是NG-SHOW&NG-HIDE
- 为什么要做新的.Date()与new相差1小时.日期().到ISOString()
- 让谷歌数据图表有一个24小时x轴
- Jqgrid 24小时格式的日期列
- 如果在过去两个小时内没有记录,返回0,javascript逻辑
- 解析云代码作业:删除在数据库中已经存在一个小时的行
- JavaScript:如何每整小时做一些事情
- 使用 javascript 检测用户的机器使用的是 12 小时制(上午/下午)还是 24 小时制(军事时间)