입력 유형 날짜에 날짜 설정


104
<input id="datePicker" type="date" />​

크롬의 datepicker 입력 유형 날짜 에서 오늘 날짜를 설정합니다 .

$(document).ready( function() {
    var now = new Date();
    var today = now.getDate()  + '/' + (now.getMonth() + 1) + '/' + now.getFullYear();
    alert(today);
    $('#datePicker').val(today);
});​

하지만 작동하지 않습니다

이 jsFiddle 편집 -크롬에서 시도하십시오.


2
당신은 당신의 바이올린에 날짜를 선택하고이하고, 그 결과 프레임을 검사하는 경우 $('#datePicker').val();제공 "2012-09-10"하고 당신이 날짜 설정에 사용하는 형식이 아니다

제 쪽에서는 크롬으로 작동합니다. 정확히 무슨 뜻 its not working입니까?
— AdityaParab

보십시오 { currentText: "Now" }, 참조 설명서
— diEcho

나 한테 일하는 중 ... 문제가 뭐야?
— Netorica

1
@JigarPandya fr_FR (@ user108, stackoverflow.com/a/3496622/180100 참조 )

답변:


159

바이올린 링크 : http://jsfiddle.net/7LXPq/93/

이 두 가지 문제 :

  1. HTML 5의 날짜 제어는 SQL에서 사용하는 연-월-일 형식을 허용합니다.
  2. 월이 9이면 단순히 9가 아닌 09로 설정해야합니다. 그래서 그것은 주간 필드에도 적용됩니다.

데모를 보려면 바이올린 링크를 따르십시오.

var now = new Date();

var day = ("0" + now.getDate()).slice(-2);
var month = ("0" + (now.getMonth() + 1)).slice(-2);

var today = now.getFullYear()+"-"+(month)+"-"+(day) ;

$('#datePicker').val(today);

4
2012 년 이후 답변 : 한 줄의 코드로 지원되는 솔루션에 대한 답변을 확인하십시오.
— Oliv Utilo

@ OlivUtilo— 확실하지만 귀하의 답변은 때때로 잘못된 결과를 제공합니다.
— RobG

시간을 절약 해 주셨습니다. 감사합니다
— Dip Surani

128

document.getElementById("datePicker").valueAsDate = new Date()

작동해야합니다.


6
이것은 내가 지금까지 찾은 최고의 솔루션입니다 - 안드로이드 4.0.3에서 작동
— 벤 클레이튼

6
확실히 ... 허용 대답보다 덕분에 청소기를 보인다
— 가다랑어

1
나는 이것이 어떤 이유로 Safari에서 작동하지 않는다는 것을 발견했습니다 :(
— james_alvarez

Chrome 및 Edge에서 테스트했으며 제대로 작동하는 것으로 나타났습니다. @Skipjack이 말했듯이 멋진 답변입니다!
— Arun

올바른 솔루션처럼 보이지만 Safari (13.1.2)에서는 호출로 인해 잘못된 상태 예외가 발생합니다. 왜 그런지 ...?
— fbitterlich

23

업데이트 : 나는 이것을 date.toISOString().substr(0, 10). 수락 된 답변과 동일한 결과를 제공하며 좋은 지원을받습니다.


2
사파리에서 작동
— james_alvarez

4
참고 : 이것은 UTC 시간대의 날짜를 제공합니다. 대조적으로 상위 답변은 현지 시간을 사용합니다.
— Qwertie

@Qwertie-둘 다 동일한 Date객체 에서 작동 합니다 (브라우저에서 시간대를 상속하는 새 Date 또는 Date.now로 생성됨). toISOString 또는 getDate 함수를 사용하면 (내 생각에) 동일하게 해결됩니다. 나는이 원하는 동작 ...해야한다고 생각합니다 그래서
— Oliv Utilo

1
@ OlivUtilo— 아니요, 호스트의 시간대 오프셋 기간 동안은 그렇지 않습니다.
— RobG

Qwertie가 말했듯이 시간없이 날짜를 사용하는 경우 잠재적으로 잘못된 대답을 제공합니다. 예 : Sat Sep 01 2018 00:00:00 GMT + 0100은 "2018-08-31"로 변환됩니다.
— havlock

14
var today = new Date().toISOString().split('T')[0];
$("#datePicker").val(today);

위의 코드가 작동합니다.


12

나에게이 문제를 해결하는 가장 짧은 방법은 moment.js를 사용하고이 문제를 단 두 줄로 해결하는 것입니다.

var today = moment().format('YYYY-MM-DD');
$('#datePicker').val(today);

1
예 $ ( '# datePicker'). val (moment (). format ( 'YYYY-MM-DD'));
— Umair Khalid

2
Moment에 익숙하지 않은 사람들을 위해 moment ()로 임의의 Javascript Date 객체를 포맷하려는 경우 : var yourFormattedDate= moment(yourDate).format('YYYY-MM-DD'); $('#datePicker').val(yourFormattedDate);
— veuncent


1

일반적으로 날짜 입력을 사용할 때 다음 두 가지 도우미 함수를 만듭니다.

// date is expected to be a date object (e.g., new Date())
const dateToInput = date =>
  `${date.getFullYear()
  }-${('0' + (date.getMonth() + 1)).slice(-2)
  }-${('0' + date.getDate()).slice(-2)
  }`;

// str is expected in yyyy-mm-dd format (e.g., "2017-03-14")
const inputToDate = str => new Date(str.split('-'));

그런 다음 날짜 입력 값을 다음과 같이 설정할 수 있습니다.

$('#datePicker').val(dateToInput(new Date()));

그리고 이렇게 선택한 값을 검색합니다.

const dateVal = inputToDate($('#datePicker').val())

0

Datetimepicker는 항상 입력 형식 YYYY-MM-DD가 필요하며 모델의 표시 형식이나 로컬 시스템 날짜 시간에 대해서는 신경 쓰지 않습니다. 그러나 날짜 시간 선택기의 출력 형식은 원하는 것입니다 (로컬 시스템). 내 게시물에 간단한 예가 있습니다 .


-5

Jquery 버전

var currentdate = new Date();

$('#DatePickerInputID').val($.datepicker.formatDate('dd-M-y', currentdate));

4
$.datepicker기본 jQuery가 아닙니다. 당신은 플러그인을 사용하고 있으며 어떤 플러그인을 사용하고 있는지 말하지 않고이 대답은 쓸모가 없습니다.
— Emile Bergeron
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.