JSP页面中input输入框获取当前日期以及当前日期的前一天

目录

一.获取当前日期

二.获取当前日期的前一天

---

一.获取当前日期

方法一：在input输入框中直接添加value属性，并给它赋以下值：

当前日期：<input class="common" onClick="laydate({elem:'#startDate'});" 
                dateFormat="short" name="startDate" id="startDate" 
                value="<%=new SimpleDateFormat("yyyy-MM- 
                          dd").format(Calendar.getInstance().getTime())%>">

效果图为：

方法二：通过给页面添加JavaScript脚本语句来实现：

当前日期：<input class="common" onClick="laydate({elem:'#startDate'});" 
                dateFormat="short" name="startDate" id="startDate">

<%--JavaScript脚本语句--%>
<script type="text/javascript">
  //当前时间 
  var now = new Date();
  //用来查看获取的当前时间的格式为：Fri Dec 03 2021 17:57:23 GMT+0800 (中国标准时间)
  alert(now);
  //当前日期
  var currentDate = now.getFullYear()+"-"+(now.getMonth() + 1) + "-" +now.getDate();
  //用来查看获取的当前日期的格式为：2021-12-3
  alert(currentDate);
  //将获取到的当前日期的值赋值给input输入框
  $('#startDate').val(currentDate);
</script>

效果图为：

二.获取当前日期的前一天

方法一：使用Java8新特性DateTimeFormatter(时间格式化)获取当前日期的前一天，在input输入框中直接添加value属性，并给它赋以下值：

当前日期的前一天：<input class="common" onClick="laydate({elem: '#startDate'});" 
                       dateFormat="short" name="startDate" id="startDate1" 
                       value="<%=DateTimeFormatter.ofPattern("yyyy-MM-                
                                 dd").format(LocalDate.now().plusDays(-1))%>">

效果图：

方法二：通过给页面添加JavaScript脚本语句来实现：

当前日期的前一天：<input class="common" onClick="laydate({elem: '#startDate'});" 
                       dateFormat="short" name="startDate" id="startDate1">

<%--JavaScript脚本语句--%>
<script type="text/javascript">
  //当前时间 
  var now = new Date();
  //用来查看获取的当前时间的格式为：Fri Dec 03 2021 17:57:23 GMT+0800 (中国标准时间)
  alert(now);
  //给当前日期的前一天进行赋值
  now.setTime(now.getTime() - 24*60*60*1000);
  //获取当前日期的前一天的日期
  var DayBefore = now.getFullYear()+"-"+(now.getMonth() + 1) + "-" +now.getDate();
  //用来查看获取的当前日期的前一天的日期的格式为：2021-12-2  
  alert(DayBefore)  
  //给输入框赋值
  document.getElementById('startDate1').value = DayBefore;
</script>  

 效果图：

 补充：由于我此处的需求是获得的当前日期的前一天的日期格式为：XXXX-XX-XX,所以我进行了以下的修改，其中，开始日期使用方法一，结束日期使用方法二：

开始日期：<input class="common" onClick="laydate({elem: '#startDate'});" 
                dateFormat="short" name="startDate" id="startDate" 
                value="<%=DateTimeFormatter.ofPattern("yyyy-MM- 
                          dd").format(LocalDate.now().plusDays(-1))%>">

结束日期：<input class="common" onClick="laydate({elem: '#endDate'});" 
                dateFormat="short" name="endDate" id="endDate">

<%--JavaScript脚本语句--%>
<script type="text/javascript">
    //当前日期
    var now = new Date();
    //用来查看获取的当前时间的格式为：Fri Dec 03 2021 18:38:06 GMT+0800 (中国标准时间)
    alert(now);
    //年
    var year = now.getFullYear();
    //月
    var month = now.getMonth() + 1;
    //给当前日期的前一天进行赋值
    now.setTime(now.getTime() - 24*60*60*1000);
    //日 如果在10号之内的话,则其前拼接字符串"0"
    var day = now.getDate()<10?"0"+now.getDate():now.getDate();
    //获取年-月-日
    var currentTime = year + "-" + month + "-" + day;
    //输出当前日期的前一天的日期 2021-12-02
    alert(currentTime);
    //给输入框赋值
    document.getElementById('endDate').value = currentTime;
</script>

效果图为： 

 【注】：JavaScript脚本中，给输入框进行赋值有两种方法

方法一：

document.getElementById('endDate').value = currentTime;

方法二：

$('#endDate').val(currentTime);