Widget:Countdown：修订间差异

←上一编辑下一编辑→

可视化wikitext

2026年5月3日 (日) 15:26的版本

这是一个倒计时微件，仅供{{Countdown}}使用。

@@ 第1行： / 第1行： @@
-<noinclude>
-这是一个活动倒计时组件,仅供{{tl|Countdown}}使用。
-{{#widget:Countdown|target=today-end}}
-</noinclude>
 <includeonly>
+<span class="custom-countdown"
-<span class="countdown-timer" data-target="<!--{$target|default:'today-end'|escape:'quotes'}-->">...</span>
+      data-target="<!--{$time|default:$1|escape:'quotes'}-->"
+      data-before="<!--{$before|default:'$1前'}-->"
+      data-after="<!--{$after|default:'还剩$1'}-->">...</span>
 <script>
 (function() {
      let t = null;
      function u() {
-         const n = new Date();
+         const now = new Date();
-         document.querySelectorAll('.countdown-timer').forEach(el => {
+         document.querySelectorAll('.custom-countdown').forEach(el => {
-             const s = el.getAttribute('data-target');
+             const targetStr = el.getAttribute('data-target');
-             let g = s === 'today-end' ?
+             const beforeTpl = el.getAttribute('data-before');
-                new Date(n.getFullYear(), n.getMonth(), n.getDate(), 23, 59, 59) :
+            const afterTpl = el.getAttribute('data-after');
-                new Date(s);
+            // 处理仅年份的情况，补全为 YYYY-01-01
+            const finalTargetStr = /^\d{4}$/.test(targetStr) ? targetStr + "-01-01T00:00:00" : targetStr;
+            const target = new Date(finalTargetStr);
-            const d = g - n;
+             if (isNaN(target)) {
+                 el.innerHTML = '<span style="color:red">时间格式错误</span>';
-             if (d <= 0) {
-                 el.innerHTML = "Ended";
                  return;
              }
-             const h = Math.floor(d / 36e5);
+             const diff = target - now;
-             const m = Math.floor((d % 36e5) / 6e4);
+            const absDiff = Math.abs(diff);
-             const c = Math.floor((d % 6e4) / 1e3);
+            // 计算时间差值字符串
+            const days = Math.floor(absDiff / 864e5);
+            const hours = Math.floor((absDiff % 864e5) / 36e5);
+             const mins = Math.floor((absDiff % 36e5) / 6e4);
+             const secs = Math.floor((absDiff % 6e4) / 1000);
-             el.innerHTML = [h, m, c].map(v => v < 10 ? "0" + v : v).join(":");
+             let diffStr = "";
+            if (days > 0) diffStr += days + "天";
+            if (hours > 0 || days > 0) diffStr += hours + "小时";
+            if (mins > 0 || hours > 0 || days > 0) diffStr += mins + "分";
+            diffStr += secs + "秒";
+            // 根据时间正负应用模板
+            if (diff > 0) {
+                el.innerHTML = afterTpl.replace('$1', diffStr);
+            } else {
+                el.innerHTML = beforeTpl.replace('$1', diffStr);
+            }
          });
      }
-     function start() {
+     function start() { if(!t){ u(); t=setInterval(u, 1000); } }
-        if (!t) {
+     function stop() { clearInterval(t); t=null; }
-            u();
+     document.addEventListener('visibilitychange', () => { document.hidden ? stop() : start(); });
-            t = setInterval(u, 1000);
-        }
-    }
-     function stop() {
-        clearInterval(t);
-        t = null;
-    }
-     document.addEventListener('visibilitychange', () => {
-        if (document.hidden) {
-            stop();
-        } else {
-            start();
-        }
-    });
      start();
 })();
 </script>
-</includeonly>
+</includeonly><noinclude>
+这是一个倒计时微件，仅供{{tl|Countdown}}使用。
+</noinclude>