setel tanggal pada tanggal tipe masukan

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

saya akan mengatur tanggal hari ini di tanggal tipe input datepicker di chrome.

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

tapi tidak berhasil

Edit jsFiddle Ini - Silakan coba di chrome.

Pengirim
sumber
2
Jika Anda memilih tanggal pada biola Anda dan memeriksa bingkai hasil, melakukan $('#datePicker').val();memberi "2012-09-10"dan itu bukan format yang Anda gunakan untuk menyetel tanggal
Ini bekerja di chrome di pihak saya .. Apa sebenarnya yang Anda maksud dengan its not working?
AdityaParab
coba { currentText: "Now" }
:,
bekerja pada saya ... apa masalahnya?
Netorica
1
@JigarPandya fr_FR (@ user108, ​​lihat juga stackoverflow.com/a/3496622/180100 )

Jawaban:

159

Tautan biola: http://jsfiddle.net/7LXPq/93/

Dua masalah dalam hal ini:

  1. Kontrol tanggal di HTML 5 menerima dalam format Tahun - bulan - hari seperti yang kita gunakan di SQL
  2. Jika bulannya 9, itu perlu ditetapkan sebagai 09 bukan 9 secara sederhana. Jadi itu berlaku untuk bidang siang juga.

Silakan ikuti tautan biola untuk demo:

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);
Dhanasekar
sumber
4
Jawaban pasca-2012: periksa jawaban saya untuk solusi yang didukung dalam satu baris kode.
Oliv Utilo
@ OlivUtilo — tentu, tetapi jawaban Anda akan memberikan hasil yang salah pada suatu waktu.
RobG
Anda menghemat waktu saya Bung, Terima kasih banyak
Dip Surani
128

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

harus bekerja.

int32_t
sumber
6
Ini adalah solusi terbaik yang saya temukan sejauh ini - berfungsi pada Android 4.0.3
Ben Clayton
6
Jelas tampak lebih bersih daripada jawaban yang diterima ... terima kasih
Skipjack
1
Saya menemukan bahwa ini tidak berfungsi di Safari karena beberapa alasan :(
james_alvarez
Diuji di Chrome dan Edge & berfungsi dengan baik. Seperti yang dikatakan @Skipjack, adalah Jawaban yang luar biasa!
Arun
Sepertinya solusi yang tepat, namun di Safari (13.1.2) panggilan tersebut memberi Anda Pengecualian Status Tidak Valid. Tidak yakin kenapa ...?
fbitterlich
23

Pembaruan: Saya melakukan ini dengan date.toISOString().substr(0, 10). Memberikan hasil yang sama dengan jawaban yang diterima dan memiliki dukungan yang baik.

Oliv Utilo
sumber
2
Bekerja di safari
james_alvarez
4
Catatan: ini memberikan tanggal dalam zona waktu UTC. Sebaliknya, jawaban teratas menggunakan waktu setempat.
Qwertie
@Qwertie - keduanya beroperasi pada Dateobjek yang sama (dibuat dengan Date atau Date.now baru, yang mewarisi zona waktu dari browser). menggunakan toISOString atau fungsi getDate akan (menurut saya) menyelesaikan hal yang sama; jadi saya pikir ini harus memiliki perilaku yang diinginkan ...
Oliv Utilo
1
@ OlivUtilo — Tidak, mereka tidak melakukan pengimbangan zona waktu untuk tuan rumah.
RobG
Seperti yang dikatakan Qwertie, ini berpotensi memberikan jawaban yang salah jika Anda menggunakan kencan tanpa waktu. mis. Sabtu, 01 Sep 2018 00:00:00 GMT + 0100 diubah menjadi "2018-08-31"
havlock
14
var today = new Date().toISOString().split('T')[0];
$("#datePicker").val(today);

Kode di atas akan berfungsi.

Gourav Makhija
sumber
12

bagi saya cara terpendek untuk menyelesaikan masalah ini adalah dengan menggunakan moment.js dan menyelesaikan masalah ini hanya dalam 2 baris.

var today = moment().format('YYYY-MM-DD');
$('#datePicker').val(today);
Umair Khalid
sumber
1
ya seperti $ ('# datePicker'). val (moment (). format ('YYYY-MM-DD'));
Umair Khalid
2
Untuk orang yang tidak terbiasa dengan Momen, jika Anda ingin memformat objek Tanggal Javascript arbitrer dengan momen (): var yourFormattedDate= moment(yourDate).format('YYYY-MM-DD'); $('#datePicker').val(yourFormattedDate);
veuncent
4

Kode Anda akan berfungsi jika dalam format ini:, YYYY-MM-DDini adalah standar komputer untuk format tanggal http://en.wikipedia.org/wiki/ISO_8601

Dominic
sumber
1

Saya biasanya membuat dua fungsi pembantu ini saat menggunakan input tanggal:

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

Anda kemudian dapat mengatur nilai masukan tanggal sebagai:

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

Dan mengambil nilai yang dipilih seperti itu

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

Datetimepicker selalu membutuhkan format input YYYY-MM-DD, tidak peduli dengan format tampilan model Anda, atau tentang waktu sistem lokal Anda. Tetapi format keluaran dari pemilih waktu adalah yang Anda inginkan (sistem lokal Anda). Ada contoh sederhana di postingan saya .

Eda Jede
sumber
0

Anda hanya dapat menggunakan tanggal dalam masukan type="date"seperti dalam formatYYYY-MM-DD

Saya telah menerapkan helper sebagai formatDate pada express-handlebars NODE.js, tidak perlu khawatir ... cukup gunakan format seperti yang dijelaskan di baris pertama.

misalnya:

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

Versi jquery

var currentdate = new Date();

$('#DatePickerInputID').val($.datepicker.formatDate('dd-M-y', currentdate));
Krutarth Vora
sumber
4
$.datepickerbukan jQuery default. Anda menggunakan plugin dan tanpa mengatakan yang mana, jawaban ini tidak berguna.
Emile Bergeron