如果用户的机器使用12小时时钟(上午/下午)或24时钟(军事时间),则使用javascript检测

Question

是否可以检测用户的机器是使用12小时制(上午/下午)还是24小时制(军事时间)？

一种方法是检查用户的区域设置,但是它只是大量的区域设置比较列表,而美国想要12小时时钟的人可以发送我的区域设置,而不是US_en,我无法知道她的偏好.与此同时,来自美国的某人可能会将她的机器设置为使用12小时时间格式而不需要12小时时钟.

编辑:

date.toLocaleTimeString();

正如下面的用户Mouser所建议的那样,它可以理论化,但遗憾的是它在WebKit浏览器上进行了测试(在Chrome上测试,在Windows上测试了新的Opera),并且出于某种原因总是返回上午/下午的时间.

示例:http://jsfiddle.net/sjuaL3p4/

所以我想如果有人知道如何在webkit浏览器上完成它,我必须重新解释我的问题.

Answer 1

您可以利用国际化 APIresolvedOptions来确定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

Answer 2

此解决方案适用于大多数浏览器,但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; 概念证明

对于Chrome来说,这是一个丑陋的解决方案.它country_code通过嗅探用户reverse geolocation.对于使用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");
		}
	}