source

입력 유형 날짜로 날짜 설정

manysource 2023. 8. 8. 21:42

입력 유형 날짜로 날짜 설정

오늘 날짜는 Chrome에서 date picker input type date로 설정하겠습니다.

$(document).ready(function() {
    let now = new Date();
    let today = now.getDate()  + '/' + (now.getMonth() + 1) + '/' + now.getFullYear();
    console.log(today);
    $('#datePicker').val(today);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="datePicker" type="date">

하지만, 그것은 작동하지 않습니다.

코드 스니펫을 Chrome으로 시도해 보십시오.

피들 링크: 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);

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

작동해야 합니다.

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

위의 코드가 작동합니다.

업데이트: 이 작업을 사용합니다.date.toISOString().substr(0, 10)승인된 답변과 동일한 결과를 제공하고 지원이 좋습니다.

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

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

다음 형식이었다면 코드가 작동했을 것입니다.YYYY-MM-DD이것은 http://en.wikipedia.org/wiki/ISO_8601 날짜 형식의 컴퓨터 표준입니다.

나는 보통 날짜 입력을 사용할 때 다음 두 가지 도우미 기능을 만듭니다.

// 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())

입력에 날짜만 사용할 수 있습니다.type="date"서식대로YYYY-MM-DD

도우미를 다음과 같이 구현했습니다.formatDateNODE.js 익스프레스 핸들 바에서는 걱정할 필요가 없습니다...첫 번째 줄에 설명된 형식을 사용합니다.

예:

< input type="date" id="date" name="date" class="form-control" value="{{formatDate invoice.date 'YYYY-MM-DD'}}" />

2021

이 작업을 수행하는 가장 좋은 방법은 로케일을 형식 지정에 사용하는 것입니다.여러분은 그것을 다양한 방법으로 사용할 수 있습니다.이 기능은 jquery datepicker가 아닌 html datepicker를 사용하는 경우에 사용할 수 있습니다.

  $("#datepickerEnd").val(new Date().toLocaleDateString('en-CA'));//YYYY-MM-dd

또는 조작, 조정 또는 다른 용도로 분할할 수 있습니다.

let theDate = new Date();
  $("#datepickerEnd").val(theDate.toLocaleDateString('en-CA'));//YYYY-MM-dd

조작 예.

  theDate.setDate(theDate.getDate()-7);
  $("#datepickerStart").val(theDate.toLocaleDateString('en-CA'));//YYYY-MM-dd

'en-ca'는 제 데이트 상대를 고르는 데 필요한 형식입니다.다른 경우 일치하는 문자열 형식을 찾을 수 있습니다.문자열로 변환하기 때문에 영역별로 망치기 위한 추가 정보가 포함되어 있지 않습니다.따라서 이러한 방식으로 순수한 형식 지정에 사용할 수 있습니다.

자세한 정보는

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString

Datetime Picker에는 항상 입력 형식 YYYY-MM-DD가 필요합니다. 모델의 디스플레이 형식이나 로컬 시스템 날짜 시간에 상관 없습니다.그러나 날짜 선택기의 출력 형식은 원하는(로컬 시스템) 것입니다. 게시물에는 간단한 예가 있습니다.

은 로일날올입른형얻가방빠입니다.type="date"다음과 같습니다.

var d = new Date(); 
var today = d.getFullYear()+"-"+("0"+(d.getMonth()+1)).slice(-2)+"-"+("0"+d.getDate()).slice(-2);

또는 다음과 같습니다.

var d = new Date().toLocaleDateString().split('/');
var today = d[2]+"-"+("0"+d[0]).slice(-2)+"-"+("0"+d[1]).slice(-2);

그런 다음 날짜 입력 값을 설정합니다.

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

사용해 보십시오.

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

참고: Moment.js를 종속성으로 추가해야 합니다.

한 가지 표현으로 해결책:

$('#datePicker').val(
    new Date()
    .toLocaleDateString("en-US", 
    {year:"numeric",month:"2-digit",day:"2-digit"})
   .replace(/(\d+).(\d+).(\d+)/,"$3-$2-$1")
)

Jquery 버전

var currentdate = new Date();

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

언급URL : https://stackoverflow.com/questions/12346381/set-date-in-input-type-date