日期控件如何处理后台传回的Date类型的数据

最新推荐文章于 2022-10-31 16:22:10 发布

chenbinqq

最新推荐文章于 2022-10-31 16:22:10 发布

阅读量3k

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/qiushisoftware/article/details/89918725

版权

JavaScript 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

问题描述：

jsp中日期控件的定义如下

<td>
    <input type="text" id="certificateValidity"  name="certificateValidity" readonly="readonly" value="<fmt:formatDate value='${certificateValidity}' pattern="yyyy-MM-dd"/>" onfocus="WdatePicker()" class="Wdate"/> 
</td>

时间日期控件使用的是My97DatePicker，jsp中引入的时间控件js如下：

<script type="text/javascript" src="<%=basePath%>js/My97DatePicker/WdatePicker.js"></script>

在后台该字段对应的实体类中，certificateValidity的数据类型为String类型时，在jsp中的js代码里，使用如下一行代码即可将从后台传递过来的该字段的值，赋值给时间控件，没有问题。

$("#certificateValidity").val(data.certificateValidity);

现在，需要将后台该字段对应的实体类中，certificateValidity的数据类型修改为Date类型，此时，如果仍然使用上面一行代码给时间控件赋值的话，效果如下图所示。

问题分析：

在给时间控件赋值的js代码行上面一行，添加debugger

debugger;

这样在点击F12打开浏览器的调试模式后，执行到这一行js代码时，就会暂时停留在此处，此时，就可以进行js代码的调试。

在右侧工具条的Watch中，添加data.certificateValidity，可以实时查看到该变量值的变化

当js代码执行并停留在debugger；这一代码行时，查看此时Watch中该变量的值

解决方案：

date.js

       //获得日期和时间
  		function getTime(date){
			var YY =date.getFullYear();
			var MM = date.getMonth()+1;   
	            if(MM<10) MM = '0' + MM;   
	        var dd = date.getDate();   
	            if(dd<10) dd = '0' + dd;   
	        var hh = date.getHours();   
	            if(hh<10) hh = '0' + hh;   
	        var mm = date.getMinutes();   
	            if(mm<10) mm = '0' + mm;   
	        var ss = date.getSeconds();   
	            if(ss<10) ss = '0' + ss;
	         return  YY+"-"+MM+"-"+dd+" "+hh+":"+mm+":"+ss;
		}
  		
  		 //获得日期
  		function getDate(date){
			var YY =date.getFullYear();
			var MM = date.getMonth()+1;   
	            if(MM<10) MM = '0' + MM;   
	        var dd = date.getDate();   
	            if(dd<10) dd = '0' + dd;   
	       
	         return  YY+"-"+MM+"-"+dd;
		}

在jsp页面中引入该js

<%@ page language="java" import="java.util.*"   pageEncoding="UTF-8"  %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
	   <base href="<%=basePath %>">
       <script type="text/javascript" src="<%=basePath%>js/My97DatePicker/WdatePicker.js"> 
       </script>
       <script type="text/javascript" src="<%=basePath%>js/date.js"></script>

将给时间控件赋值的js修改为如下内容：

var date = new Date(data.certificateValidity.time);
$("#certificateValidity").val(getDate(date));

此时，时间控件内容显示正常，如下图

chenbinqq

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
日期控件如何处理后台传回的Date类型的数据

问题描述：jsp中日期控件的定义如下<td> <input type="text" id="certificateValidity" name="certificateValidity" readonly="readonly" value="<fmt:formatDate value='${certificateValidity}' pattern="y...
复制链接

扫一扫

专栏目录