Qml----webengine打开的页面根据系统时区修改,javascript同理

注意webengine只有msvc编译环境才能用

main.qml

c++ 复制代码
import QtQuick 2.15
import QtQuick.Window 2.15
import QtWebEngine 1.9


Window {
    width: 640
    height: 480
    visible: true
    title: qsTr("Hello World")

    WebEngineView{
        anchors.fill:parent;
        url:"./test.html"
    }
}

test.html

复制代码
<!DOCTYPE html>
<html lang ="zh-CN">
<head>test
<meta charset="UTF-8">

</head>
<script>
function updateTime(){
    var now = new Date();
    var timestamp = 1609459200000; //2021-01-01 00.00.00 utc
    var localTime = new Date(timestamp);


    //跟新当前时间
    document.getElementById('current-time').textContent = unChangeTimezone(now);

    //跟新时间戳
    document.getElementById('timestamp-time').textContent = unChangeTimezone(localTime);

    //跟新修改的当前时间
    document.getElementById('change-current-time').textContent = ChangeTImezone(now).toString();

    //跟新修改的时间戳
    document.getElementById('change-timestamp-time').textContent = ChangeTImezone(timestamp).toString();
}

window.onload = function(){
    setInterval(updateTime,1000);
    updateTime();
}
function unChangeTimezone(n){
    var now = new Date(n)
    y = now.getFullYear();
    m = now.getMonth()+1;
    d = now.getDate();
    return y + "-" + (m<10? "0"+m : m) + "-" + (d <10 ? "0"+d:d) + " " +now.toTimeString().substr(0,8);
}

function ChangeTImezone(datevalue){

    //获取本地时区
    timezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
    document.getElementById('timezone').textContent = timezone;

    const options = {
        year:'numeric',
        month: '2-digit',
        day: '2-digit',
        hour: '2-digit',
        minute: '2-digit',
        second: '2-digit',
        hour12:false,
        timeZone:timezone
    };
   
    const parts = new Intl.DateTimeFormat('zh-CN',options).formatToParts(datevalue);
    // if(datevalue instanceof Date && !isNaN(datevalue.getTime())){
    //     //有效Date对象
    //     const parts = formatter.formatToParts(datevalue);
    // }
    // else if(typeof datevalue === 'number' && !isNaN(datevalue)){
    //     //有效时间戳
       
    //     const parts = formatter.formatToParts(new Date(datevalue));
    // }

    // 手动拼接成 'YYYY-MM-DD HH:MM:SS' 格式
    const year = parts.find(part => part.type === 'year').value;
    const month = parts.find(part => part.type === 'month').value;
    const day = parts.find(part => part.type === 'day').value;
    const hour = parts.find(part => part.type === 'hour').value;
    const minute = parts.find(part => part.type === 'minute').value;
    const second = parts.find(part => part.type === 'second').value;
    return year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second;
}

</script>
<body>
    <p>当前时间:<span id = "current-time"></span></p>
    <p>时间戳时间(utc2021-01-01 00.00.00):<span id = "timestamp-time"></span></p>
    <p>修改后的当前时间:<span id = "change-current-time"></span></p>
    <p>修改后时间戳时间(北京时间应该为2021.01.01 08):<span id = "change-timestamp-time"></span></p>
    <p>显示时区 <spad id = "timezone"></spad></p>
</body>
</html>​

手动修改电脑的时区,网页上也会修改

相关推荐
xier1234562 分钟前
three-instance-batch 开发笔记
javascript·three.js
王林不想说话3 分钟前
TypeScript 进阶知识总结:从 extends、泛型到 infer,一篇打通 TS 类型系统
前端·javascript·typescript
罗超驿8 分钟前
15.JavaScript 函数与作用域完全指南:语法、参数、表达式与作用域链实战
开发语言·前端·javascript
.千余10 分钟前
【C++】C++类与对象2:C++构造函数、运算符重载与流输入输出全面解析
c语言·开发语言·前端·c++·经验分享
郭涤生15 分钟前
C++ 高性能状态机
开发语言·c++
一念&29 分钟前
油猴脚本教程——元数据块
javascript·浏览器·脚本·油猴
SOC罗三炮31 分钟前
OpenHuman 源码深度解构:一个 Rust 驱动的本地优先 AI 个人助手
开发语言·人工智能·rust
心怀梦想的咸鱼35 分钟前
OpenCode 接入 API 报错 read ECONNRESET:基于环境变量的证书校验绕过方案
开发语言·php
程序大视界1 小时前
【Python系列课程】Python入门教程
开发语言·人工智能·python
谭光志1 小时前
如何从零开始实现一个 AI Agent CLI
前端·javascript·ai编程