115 lines
8.1 KiB
HTML
115 lines
8.1 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover">
|
||
<meta name="format-detection" content="telephone=no">
|
||
<title>孕周计算器</title>
|
||
<!-- 孕期计算器 · 孕周计算器（2026-11-04 用户从 20 个备选里选了带星的 10 个，本页是其中之一）。
|
||
算法：孕周 = 今天 − 末次月经第一天（周期不是 28 天的顺延 周期−28 天）；或 = 今天 −（预产期 − 280 天）。
|
||
孕月按 4 周一个月（孕 1～10 月）；孕早期 < 14 周、孕中期 14～27+6 周、孕晚期 ≥ 28 周；37 周足月、42 周过期。
|
||
宝宝像什么用全生态统一表 /common/baby-size.js（别自己维护）。预产期计算器填过的值直接拿来用。
|
||
共用 ../_shared/calc.css + calc.js（返回 / 禁回弹 / 日期按北京时间 / 记住上次填的值）；自成一页，不引 app.js。 -->
|
||
<link rel="stylesheet" href="../_shared/calc.css?v=26110403">
|
||
<style>:root{--c:#E2668E;--c2:#FF9DB8;--cbg:#FFEEF3}.bs{display:flex;align-items:center;gap:12px;margin-top:12px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.18)}.bs i{font-style:normal;font-size:30px;line-height:1}.bs b{display:block;font-size:15px}.chk{display:flex;align-items:center;gap:10px;margin-top:10px}.chk .in{flex:1;margin:0}.chk b{flex:none;min-width:120px;text-align:right;font-size:15px;color:var(--c)}</style>
|
||
</head>
|
||
<body>
|
||
<div id="scroll">
|
||
<header class="bar" id="bar">
|
||
<button class="back" id="back" aria-label="返回"><svg viewBox="0 0 24 24"><path d="M15 5l-7 7 7 7"/></svg></button>
|
||
<span class="t">孕期计算器</span>
|
||
</header>
|
||
<section class="hd"><p>孕期计算器</p><h1>孕周计算器</h1><span>今天孕几周几天、孕几个月、宝宝像什么，填一个日期就知道</span></section>
|
||
<section class="calc">
|
||
<div class="res" id="res"><div class="empty">填好下面的日期，马上出结果</div></div>
|
||
<div class="tabs" id="tabs"><button type="button" data-v="lmp">按末次月经</button><button type="button" data-v="due">按预产期</button></div>
|
||
<div id="fLmp">
|
||
<div class="fld"><label class="lb" for="cLmp">末次月经第一天</label><input class="in num" type="date" id="cLmp"></div>
|
||
<div class="fld"><span class="lb">月经周期<small>两次月经第一天间隔几天</small></span>
|
||
<div class="stp"><button type="button" id="cyM" aria-label="减一天">−</button><b class="num" id="cyV">28 天</b><button type="button" id="cyP" aria-label="加一天">+</button></div></div>
|
||
</div>
|
||
<div id="fDue" class="hide">
|
||
<div class="fld"><label class="lb" for="cDue">预产期<small>产检本上医生写的那个</small></label><input class="in num" type="date" id="cDue"></div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="sec hide" id="sStage">
|
||
<h2>我的孕期进度</h2>
|
||
<p class="lead">几个关键节点分别是哪天</p>
|
||
<ol class="tl" id="tl"></ol>
|
||
</section>
|
||
|
||
<section class="sec hide" id="sAsk">
|
||
<h2>查某一天是孕几周</h2>
|
||
<p class="lead">比如产检那天、旅行那天、某个节日</p>
|
||
<div class="chk"><input class="in num" type="date" id="cAsk"><b class="num" id="rAsk">选个日期</b></div>
|
||
</section>
|
||
|
||
<div class="tip"><b>孕周以早孕 B 超为准：</b>月经不规律或记不清末次月经时，医生会按孕早期 B 超（头臀长）定孕周。这里算的是常规算法，仅供参考。</div>
|
||
<p class="foot">计算结果仅供参考，不能代替医生诊断。</p>
|
||
</div>
|
||
<script src="../_shared/calc.js?v=26110403"></script>
|
||
<script src="/common/baby-size.js?v=26101001"></script>
|
||
<script>
|
||
(function () {
|
||
'use strict';
|
||
var C = window.CK, $ = C.$;
|
||
C.shell();
|
||
var DAY = C.DAY, T = C.today();
|
||
var st = C.store('mmbox.calc.yunzhou', { m: 'lmp', lmp: '', cy: 28, due: '' });
|
||
if (!st.lmp && !st.due) { var sd = C.savedDue(); if (!isNaN(sd)) { st.m = 'due'; st.due = C.fmt(sd); } } /* 预产期计算器填过就直接用 */
|
||
$('#cLmp').max = C.fmt(T); $('#cLmp').min = C.fmt(T - 300 * DAY);
|
||
$('#cDue').min = C.fmt(T - 60 * DAY); $('#cDue').max = C.fmt(T + 300 * DAY);
|
||
var tabUi = C.seg($('#tabs'), st, 'm', function () { ui(); paint(); });
|
||
function ui() {
|
||
$('#fLmp').classList.toggle('hide', st.m !== 'lmp'); $('#fDue').classList.toggle('hide', st.m !== 'due');
|
||
$('#cLmp').value = st.lmp; $('#cDue').value = st.due; $('#cyV').textContent = st.cy + ' 天';
|
||
}
|
||
function start() { /* 孕 0 周 0 天那天 */
|
||
if (st.m === 'lmp') { var l = C.parse(st.lmp); return isNaN(l) ? NaN : l + (st.cy - 28) * DAY; }
|
||
var d = C.parse(st.due); return isNaN(d) ? NaN : d - 280 * DAY;
|
||
}
|
||
function wk(g) { var w = Math.floor(g / 7), d = g % 7; return w + ' 周' + (d ? ' + ' + d + ' 天' : ''); }
|
||
var MS = [['孕早期结束', 14 * 7, '最容易不舒服的阶段过去了'], ['孕中期 · 开始有胎动', 18 * 7, '18～20 周左右能感到胎动'], ['孕晚期开始', 28 * 7, '产检变成两周一次'],
|
||
['足月', 37 * 7, '这之后出生都算足月'], ['预产期', 280, ''], ['过期妊娠', 294, '到 41 周还没动静，医生一般会安排催产']];
|
||
function paint() {
|
||
st.save();
|
||
var s0 = start(), R = $('#res');
|
||
['#sStage', '#sAsk'].forEach(function (k) { $(k).classList.toggle('hide', isNaN(s0)); });
|
||
if (isNaN(s0)) { R.innerHTML = '<div class="empty">填好下面的日期，马上出结果</div>'; return; }
|
||
var g = Math.floor((T - s0) / DAY);
|
||
if (g < 0 || g > 300) { R.innerHTML = '<div class="empty">这个日期算出来不在孕期里，再核对一下</div>'; return; }
|
||
var w = Math.floor(g / 7), mon = Math.min(10, Math.floor(g / 28) + 1), stage = w < 14 ? '孕早期' : w < 28 ? '孕中期' : '孕晚期', left = 280 - g;
|
||
var bs = window.BabySize && w >= 4 ? BabySize.get(w) : null;
|
||
R.innerHTML = '<small>今天是</small><b class="big num">孕 ' + wk(g) + '</b>' +
|
||
'<div class="row"><div><small>孕几个月</small><b>孕 ' + mon + ' 月</b></div><div><small>所处阶段</small><b>' + stage + '</b></div><div><small>' + (left >= 0 ? '离预产期' : '已过预产期') + '</small><b class="num">' + Math.abs(left) + ' 天</b></div></div>' +
|
||
'<div class="pg"><i style="width:' + Math.min(100, g / 280 * 100).toFixed(1) + '%"></i></div>' +
|
||
(bs ? '<div class="bs"><i>' + bs.emoji + '</i><span><small>宝宝现在</small><b>像' + C.esc(bs.name) + ' · 约 ' + C.esc(bs.txt) + '</b></span></div>' : '<span class="note">孕 4 周以后就能看到宝宝像什么啦</span>');
|
||
$('#tl').innerHTML =
|
||
MS.map(function (m) {
|
||
var t = s0 + m[1] * DAY, done = T >= t, nx = !done && MS.filter(function (x) { return s0 + x[1] * DAY > T; })[0] === m;
|
||
return '<li class="' + (done ? 'done' : nx ? 'now' : '') + '"><i class="d"></i><div class="m"><b>' + m[0] + (nx ? '<em>还有 ' + Math.round((t - T) / DAY) + ' 天</em>' : '') + '</b>' +
|
||
'<span><i class="num">' + C.cn(t, 1) + ' ' + C.wd(t) + '</i> · 孕 ' + wk(m[1]) + (m[2] ? ' · ' + m[2] : '') + '</span></div></li>';
|
||
}).join('');
|
||
ask();
|
||
}
|
||
function ask() {
|
||
var s0 = start(), a = C.parse($('#cAsk').value), o = $('#rAsk');
|
||
if (isNaN(s0) || isNaN(a)) { o.textContent = '选个日期'; return; }
|
||
var g = Math.floor((a - s0) / DAY);
|
||
o.textContent = g < 0 ? '那时还没怀上' : g > 300 ? '宝宝早出生啦' : '孕 ' + wk(g);
|
||
}
|
||
$('#cLmp').addEventListener('change', function () { st.lmp = this.value; paint(); });
|
||
$('#cDue').addEventListener('change', function () { st.due = this.value; paint(); });
|
||
$('#cAsk').addEventListener('change', ask);
|
||
$('#cyM').addEventListener('click', function () { st.cy = Math.max(21, st.cy - 1); ui(); paint(); });
|
||
$('#cyP').addEventListener('click', function () { st.cy = Math.min(45, st.cy + 1); ui(); paint(); });
|
||
tabUi(); ui(); paint();
|
||
})();
|
||
</script>
|
||
<script src="../_shared/brand.js?v=26110203"></script>
|
||
<script src="../../js/share-card.js?v=26110403"></script>
|
||
<script>window.mbShare('../../assets/share/t/yunzhou-js.jpg', '孕周计算器：今天孕几周几天，宝宝像什么'); /* 11-04 微信转发图 */</script>
|
||
</body>
|
||
</html>
|