sadfoo2019 发表于 2021-3-17 17:14

如何用JS来解决呢?

本帖最后由 sadfoo2019 于 2021-3-17 23:46 编辑

那位能整合下评论区的答案来一个完整可用的版本,类似于这样的


需求:就是想再OA的表单上自动实现下面的几个功能,用JS来实现



OA表单 是html 做的,表单上有个输入js代码的地方。

产假开始时间可以通过日期控件选择,然后想通过js来计算选择的日期加上128天后的日期填写到后面的 产假结束日期 文本框里,其他的两个也类似一样的。
这两个地方的html代码如下:
<tr style="height: 35px; page-break-inside: avoid;">
            <td height="35" align="center" valign="middle" style="border-width: 0px 1px 1px; border-style: none solid solid; border-color: rgb(0, 0, 0) windowtext windowtext; padding: 0px 7px; text-align: center; -ms-word-break: break-all; background-color: transparent;" rowspan="1" colspan="2">
                产假开始时间
            </td>
            <td align="center" valign="middle" style="border-width: 0px 1px 1px; border-style: none solid solid; border-color: rgb(0, 0, 0) windowtext windowtext; padding: 0px 7px; text-align: center; -ms-word-break: break-all; background-color: transparent;" rowspan="1" colspan="2">
                <input name="DATA_55" title="产假开始时间" align="left" style="width: 100px; height: 30px; text-align: left;" type="text" value="" hidden="0"/><img name="OTHER_57" title="日期控件:产假开始时间" align="absMiddle" class="DATE" style="width: 18px; height: 18px; cursor: pointer;" alt="" src="/static/images/form/calendar.png" border="0" classname="DATE" value="产假开始时间" date_format="yyyy-MM-dd"/>
            </td>
            <td width="122" align="center" valign="middle" style="border-width: 0px 1px 1px; border-style: none solid solid; border-color: rgb(0, 0, 0) windowtext windowtext; padding: 0px 7px; text-align: center; -ms-word-break: break-all; background-color: transparent;" rowspan="1">
                产假结束时间
            </td>
            <td align="center" valign="middle" style="border-width: 0px 1px 1px; border-style: none solid solid; border-color: rgb(0, 0, 0) windowtext windowtext; padding: 0px 7px; text-align: center; -ms-word-break: break-all; background-color: transparent;" rowspan="1" colspan="2">
                <input name="DATA_56" title="产假结束时间" align="left" style="width: 100px; height: 30px; text-align: left;" type="text" hidden="0"/><img name="OTHER_58" title="日期控件:产假结束时间" align="absMiddle" class="DATE" style="width: 18px; height: 18px; cursor: pointer;" alt="" src="/static/images/form/calendar.png" border="0" classname="DATE" value="产假结束时间" date_format="yyyy-MM-dd"/>
            </td>
      </tr>

olly2013 发表于 2021-3-17 17:26

我记得js的日期是可以直接加的吧(好久没用过,也不是很确定了,如果不能,你找找有没有计算日期的函数)
后面两个应该不难,js日期转字符,直接截取月份和年份,然后+1/+6后与年份字符串拼接就可以了(如果跨年记得额外处理下)

lzy10086 发表于 2021-3-17 17:31

js上有Date对象啊,可以直接使用,进行加减以及转字符串

sadfoo2019 发表于 2021-3-17 17:32

olly2013 发表于 2021-3-17 17:26
我记得js的日期是可以直接加的吧(好久没用过,也不是很确定了,如果不能,你找找有没有计算日期的函数)
...

不能直接加,我看百度和csdn好多帖子都是要转换,另外很多还看不懂,主要还要计算了要天上去,咋个获取那些id控件都有点迷糊,哈哈哈{:1_937:}

djdl 发表于 2021-3-17 17:34

你看下整个项目用到了哪些js文件,这类项目一般都会用Jquery库,参考Jquery的change事件。https://www.w3school.com.cn/jquery/event_change.asp

sadfoo2019 发表于 2021-3-17 17:34

lzy10086 发表于 2021-3-17 17:31
js上有Date对象啊,可以直接使用,进行加减以及转字符串

{:1_893:} 给我弄一个我先救急,要回填到文本框里。:handshake

whrjflame 发表于 2021-3-17 17:42

你引入一个 day.js 看下文档。用dayjs().add()api就可以

zd14785 发表于 2021-3-17 17:58

……这不是项目练习题里经常会有的吗,我记得当初学习的时候还百度过类似的东西,csdn上一堆,如果js处理起来感觉麻烦的话,可以选择日期后自动提交给后台,后台处理这种东西应该还蛮精确的,然后返回给前端就好了。

hualonghongyan 发表于 2021-3-17 18:03

初级算法,哥哥

冰茶荼 发表于 2021-3-17 18:06



$("input").on('change',function(){
      console.log()
      var dateTime=new Date($(this).val());
      dateTime=dateTime.setDate(dateTime.getDate()+128);
      dateTime=new Date(dateTime);
      $("input").val(dateTime.toISOString().slice(0,10))
    });

页: [1] 2 3
查看完整版本: 如何用JS来解决呢?