LLWiki正在建设中，欢迎加入我们！
“Widget:Countdown”的版本间差异
跳转到导航
跳转到搜索
小部件文档
小 |
（//使用页面/文本对比查看器快速编辑） |
||
| （未显示同一用户的41个中间版本） | |||
| 第1行： | 第1行： | ||
<noinclude>{{doc|content= |
<noinclude>{{doc|content=这个小部件用于生成倒计时。请使用{{tl|countdown}}调用。 |
||
==外部链接== |
|||
请使用{{tl|countdown}}调用。}}</noinclude><includeonly><!--{if !isset($wgCountdown) || !$wgCountdown}--><!--{assign var="wgCountdown" value=true scope="global"}--><script src="/mediawiki/resources/lib/moment/moment.js"></script><script> |
|||
{{CCnotice|MGP=widget:countdown}}}}[[category:混合小部件]] |
|||
//</includeonly>JavaScript脚本：<pre lang=js> |
|||
<p>JavaScript脚本：[[User:Bhsd/widget/countdown.js]]</p></noinclude><includeonly><!--{if !isset($wgCountdown) || !$wgCountdown}--><!--{assign var="wgCountdown" value=true scope="global"}--><script defer src="/zh?title=user:bhsd/widget/countdown.js&action=raw&ctype=text/javascript"></script><style> |
|||
"use strict"; |
|||
window.addEventListener('load', function () { |
|||
var timeObj = {}; |
|||
const fromNow = function (ele) { |
|||
const now = moment(), |
|||
then = moment(ele.dataset.target), |
|||
before = ele.children[1], |
|||
after = ele.children[2], |
|||
isBefore = then.isBefore(now), |
|||
monthsHave31Days = [0, 2, 4, 6, 7, 9, 11]; // 月份从0开始 |
|||
let year = isBefore ? now.year() - then.year() : then.year() - now.year(), |
|||
month = isBefore ? now.month() - then.month() : then.month() - now.month(), |
|||
day = isBefore ? now.date() - then.date() : then.date() - now.date(), |
|||
hour = isBefore ? now.hour() - then.hour() : then.hour() - now.hour(), |
|||
minute = isBefore ? now.minute() - then.minute() : then.minute() - now.minute(), |
|||
second = isBefore ? now.second() - then.second() : then.second() - now.second(); |
|||
if (second < 0) { |
|||
minute--; |
|||
second += 60; |
|||
} |
|||
if (minute < 0) { |
|||
hour--; |
|||
minute += 60; |
|||
} |
|||
if (hour < 0) { |
|||
day--; |
|||
hour += 24; |
|||
} |
|||
if (day < 0) { |
|||
month--; |
|||
if (monthsHave31Days.includes((isBefore ? then : now).month())) { |
|||
day += 31; |
|||
} else if ((isBefore ? then : now).month() === 1) { |
|||
if ((isBefore ? then : now).year() % 4 === 0) { |
|||
day += 29; |
|||
} else { |
|||
day += 28; |
|||
} |
|||
} else { |
|||
day += 30; |
|||
} |
|||
} |
|||
if (month < 0) { |
|||
year--; |
|||
month += 12; |
|||
} |
|||
let result = ""; |
|||
if (year > 0) { |
|||
result += `<span class="countdown-num">${year}</` + 'span>年'; |
|||
} |
|||
if (month > 0) { |
|||
result += `<span class="countdown-num">${month}</` + 'span>月'; |
|||
} else if (result !== "") { |
|||
result += `<span class="countdown-num">${0}</` + 'span>月'; |
|||
} |
|||
if (day > 0) { |
|||
result += `<span class="countdown-num">${day}</` + 'span>日'; |
|||
} else if (result !== "") { |
|||
result += `<span class="countdown-num">${0}</` + 'span>日'; |
|||
} |
|||
if (hour > 0) { |
|||
result += `<span class="countdown-num">${hour}</` + 'span>' + ele.children[0].innerHTML; |
|||
} else if (result !== "") { |
|||
result += `<span class="countdown-num">${0}</` + 'span>' + ele.children[0].innerHTML; |
|||
} |
|||
if (minute > 0) { |
|||
result += `<span class="countdown-num">${minute}</` + 'span>分'; |
|||
} else if (result !== "") { |
|||
result += `<span class="countdown-num">${0}</` + 'span>分'; |
|||
} |
|||
if (second > 0) { |
|||
result += `<span class="countdown-num">${second}</` + 'span>秒'; |
|||
} else if (result !== "") { |
|||
result += `<span class="countdown-num">${0}</` + 'span>秒'; |
|||
} |
|||
if(isBefore) { |
|||
before.innerHTML = before.innerHTML.replace("$1", result.replace(/(\d) /g, "$1")); |
|||
after.style.display = "none"; |
|||
} |
|||
else { |
|||
after.innerHTML = after.innerHTML.replace("$1", result.replace(/(\d) /g, "$1")); |
|||
before.style.display = "none"; |
|||
} |
|||
}; |
|||
const run = () => { |
|||
document.querySelectorAll(".countdownNode:not(.disabled)").forEach((ele) => { |
|||
fromNow(ele); |
|||
}); |
|||
}; |
|||
document.querySelectorAll(".countdownNode").forEach((ele) => { |
|||
const time = moment(ele.dataset.target); |
|||
if (!time || !time.isValid()) { |
|||
ele.classList.add("error", "disabled") |
|||
ele.innerHTML = "（发生了致命错误！）"; |
|||
return; |
|||
} |
|||
timeObj[ele.id] = time; |
|||
}); |
|||
run(); |
|||
window.setInterval(run, 1000); |
|||
}); |
|||
//</pre> |
|||
<includeonly> |
|||
</script> |
|||
<style> |
|||
/* </includeonly>CSS样式表：<pre lang="css"> */ |
/* </includeonly>CSS样式表：<pre lang="css"> */ |
||
.countdownNode { |
|||
.countdown-num { |
|||
visibility: hidden; /* 占位 */ |
|||
display:inline-block; |
|||
} |
|||
width:1.25em; |
|||
.counting > :first-child { |
|||
text-align:right; |
|||
display: none; |
|||
} |
|||
.isBefore > :first-child { |
|||
display: inline; |
|||
} |
|||
.isBefore > :last-child { |
|||
display: none; |
|||
} |
} |
||
/* </pre><includeonly> */ |
/* </pre><includeonly> */ |
||
2022年5月17日 (二) 19:51的最新版本
小部件文档这个文档是内联文档。
这个小部件用于生成倒计时。请使用{{countdown}}调用。
外部链接
本页面含有来自萌娘百科的文本，以CC BY-NC-SA 3.0授权引入。经过双方的修改，内容可能已与来源有很大差异。
JavaScript脚本：User:Bhsd/widget/countdown.js
CSS样式表：
*/
.countdownNode {
visibility: hidden; /* 占位 */
}
.counting > :first-child {
display: none;
}
.isBefore > :first-child {
display: inline;
}
.isBefore > :last-child {
display: none;
}
/*