用 HTML + JavaScript DIY 渐进式延迟法定退休年龄测算器-阿里云开发者社区

用 HTML + JavaScript DIY 渐进式延迟法定退休年龄测算器

2024-09-29 64

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： 用 HTML + JavaScript DIY 渐进式延迟法定退休年龄测算器

0 源起

近日，全国人民代表大会常务委员会正式发布了关于实施渐进式延迟法定退休年龄的重要决定，旨在减轻社会和个人因退休年龄变化带来的冲击。

根据该决定，我国将同步启动对男、女职工法定退休年龄的延迟计划。这一调整将采取渐进式的方式进行，为期十五年。具体而言，男性职工的法定退休年龄将从现行的六十周岁逐步延长至六十三周岁，而女性职工的法定退休年龄则依据不同岗位性质，分别从现行的五十周岁（针对工人岗位）和五十五周岁（针对干部岗位或专业技术岗位）延长至五十五周岁和五十八周岁。

一些在线测算延迟法定退休年龄的网络平台、APP、小程序等也应运而生，并且被网民刷爆。

作为一名程序猿或码农，我们可以根据

全国人民代表大会常务委员会关于实施渐进式延迟法定退休年龄的决定

https://www.gov.cn/yaowen/liebiao/202409/content_6974294.htm

来自己DIY一个渐进式延迟法定退休年龄测算器。

1 用户界面

首先，我们需要为用户提供一个日期输入或选取工具来输入其本人的出生年月，为了简单起见，我们直接使用 data，即：

<input type="date" value="1980-11-11" id="dateYmd">

其次，测算延迟法定退休年龄需要分为男职工、原法定退休年龄55周岁女职工、原法定退休年龄50周岁女职工三类人群，所以我们要使用radio按钮提供三个选项，即：

<input type="radio" name="RbGender" id="RbMale" value="男" checked="true"/>男职工  
<input type="radio" name="RbGender" id="RbFemale55" value="女" />原法定退休年龄55周岁女职工  
<input type="radio" name="RbGender" id="RbFemale50" value="女" />原法定退休年龄50周岁女职工

当用户提供了出生年月，并且选择了所属的延长法定工龄类别后，我们就可以提供一个按钮来点击进行测算。

接着，我们要把测算结果显示出来。我们可以使用一个表格，显示出生时间、改革后法定退休年龄、改革后退休时间、延迟月数这4项信息，直观明了。

最后，为了方便调试，我们使用一个textarea来输出我们想了解的过程信息，如一些变量的值的变化。

完整的用户界面代码如下：

  <div style="margin-left:20%;margin-right:20%;background:#66ffff; border:3px double #0066cc; padding:3px;">
    <p style="background:#33ccff;text-align:center;font-size:18pt;margin-top:1px;">渐进式延迟法定退休年龄测算器</p>
    <p>请选择您的生日：<input type="date" value="1980-11-11" id="dateYmd"></p>
    <fieldset>
      <legend>请选择您所属的类别：</legend>
      <P><input type="radio" name="RbGender" id="RbMale" value="男" checked="true"/>男职工</P>  
      <P><input type="radio" name="RbGender" id="RbFemale55" value="女" />原法定退休年龄55周岁女职工</P>
      <P><input type="radio" name="RbGender" id="RbFemale50" value="女" />原法定退休年龄50周岁女职</P>
    </fieldset>
    <p style="margin-left:70%"><input type="button" value="测算" id="btnCheck" onclick="Measure()"></p>
    <table align="center" border="1" style="text-align:center; border: 1px solid black; cell-spacing:0; border-collapse: collapse;">
      <caption>延迟法定退休年龄每4个月延迟1个月</caption>
      <tr>
        <td>出生时间</td>
        <td>改革后法定退休年龄</td>
        <td>改革后退休时间</td>
        <td>延迟月数</td>
      </tr>
      <tr>
        <td id="tdBirth"></td>
        <td id="tdAge"></td>
        <td id="tdDate"></td>
        <td id="tdMonth"></td>
      </tr>
    </table>
    <p align="center"><textarea id="taResult" rows="15" cols="60"></textarea></p>
  </div>

2 数据设计

由于测算延迟法定退休年龄需要分为男职工、原法定退休年龄55周岁女职工、原法定退休年龄50周岁女职工三类人群，并且每类人群都涉及到起始年份（年）、法定工龄（年）、延长工龄步长（月）、延长工龄上限（月）这4项数据，我们可以定义一个2维数组来存储和使用这些数据：

    //aData结构：0：起始年份（年），1：法定工龄（年），2：延长工龄步长（月），3：延长工龄上限（月）
    var aData = new Array([1965,60,4,36],//0：男职工
           [1970,55,4,36],//1：原法定退休年龄55周岁女职工
           [1975,50,2,60]);//2：原法定退休年龄50周岁女职工

数组一共有3行，其中第1行（索引为0）存放男职工的数据，第2行为原法定退休年龄55周岁女职工的数据，第3行为原法定退休年龄50周岁女职工的数据。

3 测算流程

当用户点击“测算”按钮后，我们进行测算的流程：

1.获取用户生日数据存储到变量dateYou

      var dateYou = new Date(dateYmd.value);

2.获取用户所属类别，存储到变量iIndex

      if (document.getElementById("RbFemale55").checked)
      {
        iIndex = 1;
      }
      else
      {
        iIndex = (document.getElementById("RbFemale50").checked ? 2 :0);
      }

3.从用户生日数据dateYou提取出出生年份，和数组aData中相应类别的起始年份进行比较。

      if (dateYou.getFullYear() < aData[iIndex][0])
      {
        OutYear();
      }
      else
      {
        CountYou(dateYou);
      }

如果用户出生年份（例如1945年）小于起始年份，那么就不属于延迟法定退休年龄的人群，即不在测算范围内，我们会在表格里显示：您不在生长计算延迟法定退休之列。

    //提示：“您不在生长计算延迟法定退休之列”
    //输入：无
    //输出：无
    //20240915创建
    function OutYear()
    {
      document.getElementById("tdAge").innerHTML = document.getElementById("tdDate").innerHTML =  document.getElementById("tdMonth").innerHTML = '您不在生长计算延迟法定退休之列';
    }

4.如果用户出生日期属于延迟法定退休年龄的人群，那么我们就按方法进行测算。

    function CountYou(dateYou)
    {
      var iYouYear = dateYou.getFullYear();
      var iYouMonth = dateYou.getMonth();//getMonth()取得的数从0开始
      document.getElementById("tdBirth").innerHTML = iYouYear + '年' + (iYouMonth+1) + '月';

      var iExtMonth = (iYouYear - aData[iIndex][0]) * 12 / aData[iIndex][2] + Math.ceil((iYouMonth + 1) / aData[iIndex][2]);
      
      iExtMonth = FixExtMonth(iExtMonth);

      var iExtYear = parseInt(iExtMonth / 12);
      taResult.value += "\niYouYear=" + iYouYear + " iYourMonth=" + iYouMonth + " iExtYear=" + iExtYear + " iExtMonth=" + iExtMonth; 
      document.getElementById("tdAge").innerHTML = (iExtYear + aData[iIndex][1]) + '岁' + ((iExtMonth%12) > 0 ? (iExtMonth % 12) + '个月' : '');
      //document.getElementById("tdDate").innerHTML = (iYouYear + aData[iIndex][1] + Math.ceil((iYouMonth + iExtMonth + 1) / 12)) + '年' + ((iYouMonth + iExtMonth%12)%12+1) + '月';
      document.getElementById("tdDate").innerHTML = (iYouYear + aData[iIndex][1] + iExtYear + parseInt((iYouMonth + iExtMonth%12 + 1) / 12)) + '年' + ((iYouMonth + iExtMonth%12)%12+1) + '月';
      document.getElementById("tdMonth").innerHTML =  iExtMonth;
    }//CountYou(dateYou)

5.修正延迟月数。对于男职工、原法定退休年龄55周岁女职工这两类人群，最多是延迟3年，即36个月，对于原法定退休年龄50周岁女职工，最多是延迟5年，即60个月。我们照方法测算出来的延迟月数有可能 > 36 或 60，所以我们还需要再进行一次修正，即：

男职工、原法定退休年龄55周岁女职工、这两类人群的延迟月数如果 > 36，就要改成36；

原法定退休年龄50周岁女职工这类人群的延迟月数如果 > 60，就要改成60。

    //根据上限修正延长工龄月数
    //输入：Months：待修正的延长工龄月数
    //输出：修正后的延长工龄月数
    //20240915创建
    function FixExtMonth(Months)
    {
      return (Months > aData[iIndex][3] ? aData[iIndex][3] : Months);
    }//FixExtMonth(Months)