How to deal with the compatibility of easyui date and time box in IE

This time I will bring you how to deal with the compatibility of the easyui date and time box in IE, how to deal with the compatibility of the easyui date and time box in IENotesWhat are they? Here are actual cases. Let’s take a look.

A few days ago, the project entered the final stage of preparation for launch. The test suddenly found that the time obtained using the datetimebox plug-in of easyui could not be obtained later than the current time in IE. At that time This is what it says:

	$(selector).datetimebox(
	{
formatter : function(date) {
	var y = date.getFullYear();
	var m = date.getMonth() + 1;
	var d = date.getDate();
	var h = date.getHours(); //获取当前小时数(0-23)
	var mi = date.getMinutes(); //获取当前分钟数(0-59)
	var s = date.getSeconds(); 
	var result = y + '-' + (m < 10 ? '0' + m : m) + '-' + (d < 10 ? '0' + d : d)
+ " " + (h < 10 ? '0' + h : h)
+ ":" + (mi < 10 ? '0' + mi : mi);
	
	//console.log(result+"--第127行");
	if(second==false){
	} else {
result += ":" + (s < 10 ? '0' + s : s);
	}
	return result;
},
  parser : function(s) {
	var t = Date.parse(s);
	if (!isNaN(t)) {
return new Date(t);
	} else {
return new Date();
	}
}
	});

There is no problem when testing mainstream browsers such as Google Chrome. The initial echoed time can be displayed and the time can be selected. However, when I use Internet Explorer, I find that I cannot select the time and the echoed date is wrong. is the current time. Debugging After a long time, I found out that ie browser does not support the parse() method of js. The parse() method parses the date and converts it into milliseconds of the date.

formatter is the format for formatting dates. The parser parses your formatted date

Because parse cannot be used in IE, it is impossible to parse and display the formatted date time in IE. The following is the code I modified myself:

$(selector).datetimebox( 
  { 
  formatter : function(date) { 
   var y = date.getFullYear(); 
 var m = date.getMonth()+1; 
 var d = date.getDate(); 
 var h = date.getHours(); 
 var min = date.getMinutes(); 
 return y+'-'+(m<10?('0'+m):m)+'-'+(d<10?('0'+d):d)+' '+(h<10?('0'+h):h)+':'+min; 
  }, 
  parser : function(s) { 
 var ss = (s.split(" ")); 
 var ymd = ss[0].split("-"); 
 var hms = ss[1].split(":"); 
 //console.log(ymd+" "+hms); 
 var y = parseInt(ymd[0],10); 
 var m = parseInt(ymd[1],10); 
 var d = parseInt(ymd[2],10); 
 var h = parseInt(hms[0],10); 
 var min = parseInt(hms[1],10); 
 if (!isNaN(y) && !isNaN(m) && !isNaN(d) && !isNaN(h) && !isNaN(min)){ 
 return new Date(y,m-1,d,h,min); 
 } else { 
 return new Date(); 
 } 
  } 
  });

The date formatted by formatter is xxxx-xx-xx xx:x. Therefore, when parsing below, the date and time are first separated by the space between them. ss[0]==xxxx-xx-xx, ss[1]==xx:xx. In this case, use - and: to divide them into numbers. In this case, write new directly. The correct date format can be returned in the parameters of Date()~~ Well, after testing, it is perfectly compatible with the cheating browser IE.

I suddenly discovered a bug in this method when using it today, that is, if there is no data in the datetime time frame at the beginning, a split error will be reported, so I modified it today and added an empty judgment:

if(s==""){ 
 return new Date(); 
 }else{ 
 //alert(s); 
 var ss = (s.split(" ")); 
 var ymd = ss[0].split("-"); 
 var hms = ss[1].split(":"); 
 //console.log(ymd+" "+hms); 
 var y = parseInt(ymd[0],10); 
 var m = parseInt(ymd[1],10); 
 var d = parseInt(ymd[2],10); 
 var h = parseInt(hms[0],10); 
 var min = parseInt(hms[1],10); 
 if (!isNaN(y) && !isNaN(m) && !isNaN(d) && !isNaN(h) && !isNaN(min)){ 
  return new Date(y,m-1,d,h,min); 
 } else { 
  return new Date(); 
 } 
 }

It should be noted here that s is a string type~so you cannot use s==null to make the judgment condition~

I believe you have mastered the method after reading the case in this article, more Please pay attention to other related articles on php Chinese website for wonderful content!

Recommended reading:

##vue determines whether the input content has spaces

##Detailed explanation of the use of Vuex mutations and actions

The above is the detailed content of How to deal with the compatibility of easyui date and time box in IE. For more information, please follow other related articles on the PHP Chinese website!