반응형
바쁘신분들을 위해...
chrome, IE 모두 new Date를 사용하려면 replace 정규식을 활용하여
-, .등으로 구분된 날짜값을 /으로 변경처리한다.
var timedate = "2020-01-31 13:46:55";
new Date(timedate.replace(/[.-]/gi, "/")); //정상동작
//"2020/01/31 13:46:55";
air datepicker 라이브러리를 활용하여 달력을 제어할 일이 있었는데, 여기서 날짜등을 제한할때,
new Date() 메소드를 활용하여 특정 프로퍼티에 넣어주면 제한이 되었다.
년월일까지만 있는 경우에는 전혀 문제없이 달력이 동작하였는데,
어느날 버그 신고가 있어 확인해보니 제한 날짜를 입력해주는 부분이
(yyyy-MM-dd HH:mm:ss) 형태였다.
new Date 사용예시
IE와 크롬에서 결과값을 콘솔에 찍은 사진인데 날짜형태의 yyyy-MM-dd는 문제가 없다.
var str_date = "2020-01-31";
console.log(new Date(str_date));
날짜 "." 구분자
하지만 "."구분자는 문제가 있다.
var str_date = "2020.01.31";
console.log(new Date(str_date));
날짜 시간의 구분자 "-"
먼저 사용예제로 보여주었다 "-" 구분자도 시분초까지 있는 경우 문제가 발생한다.
var str_date = "2020-01-31 13:51:55";
console.log(new Date(str_date));
구분자 "/"
그럼 크롬과 IE에서 모두 동작하려면 어떻게 해야할까?
바로 구분자를 "/"으로 날짜부분을 처리하면 된다.
var str_date = "2020/01/31 13:51:55";
console.log(new Date(str_date));
정규식을 통한 크로스 브라우징
보통 날짜부분은 "-", ".", "/" 으로 구분을 많이 하는데 모두 동작하게 하려면, 정규식을 사용하면 된다.
var str_date = "2020-01-31 13:51:55"; //"2020.01.31 13:51:55"
str_date = str_date.replace(/[.-]/gi, "/") //. 또는 -으로 되어있는 부분을 치환한다.
console.log(new Date(str_date));
반응형
'WEB > Javascript' 카테고리의 다른 글
HTML, JAVASCRIPT - 테트리스 만들기 - 1(table요소, 배열값으로 테트리스 만들기) (0) | 2020.02.24 |
---|---|
구글차트 - 일정시간마다 데이터가 그려지는 구글차트 만들기 (0) | 2020.02.07 |
Javascript - 배열(Array)안에 특정 객체(Object)의 key, value값 구하기 (0) | 2020.01.30 |
Javascript - form태그 내부 ajax처리시 2번 전송되는 현상 (0) | 2020.01.22 |
Javascript - 전개구문, 전개연산자, ...문법, {...data} / rest, spread properties (0) | 2020.01.10 |