입력 유형 날짜에 날짜 설정


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.