Kullanıcıların bir tarih girmesi gerektiğinde, geliştiriciler bir giriş türü tarihinin önceden tanımlanmış/varsayılan değerini geçerli/bugün tarihine ayarlar. Artık kullanıcının tarihi manuel olarak girmesine gerek yoktur, bu anlamda kullanıcı için zaman ve emek tasarrufu sağlar. Ayrıca, kullanıcı deneyimini, verilerin doğruluğunu artırır ve kullanıcılar için daha fazla kolaylık sağlar. Etkinlik yönetim sistemi, rezervasyon sistemi vb. gibi çeşitli uygulamalara sahiptir.
Bu blog, giriş türü tarihinin varsayılan değerinin bugün olarak nasıl ayarlanacağını gösterir:
- “valueAsDate” Özelliğini Kullanma
- “toISOString()” Yöntemini Kullanma
- “getFullYear()” ve “padStart()” Yöntemlerini Kullanmak
Yöntem 1: 'valueAsDate' Özelliğini Kullanma
“ değerAsTarihi ” özelliği, “ aracılığıyla geçerli tarihi almak için kullanılır. Tarih() ' işlev. Bu işlev, bir tarihte çeşitli işlemleri gerçekleştirmek için kullanılır ve örneğin geçerli tarihi almak, belirli bir tarihi ayarlamak, tarihleri değiştirmek vb.
Daha iyi anlamak için aşağıdaki kodu ziyaret edin:
< vücut >
< div >
< etiket için = 'bugünün tarihi' > Tarih etiket >< giriş tip = 'tarih'
İD = 'bugünün tarihi' >
div >
< senaryo >
Document.getElementById ( 'bugünün tarihi' ) .valueAsDate = yeni Tarih ( ) ;
senaryo >
vücut >
Yukarıdaki kod parçacığında:
- İlk önce '
” etiketi, “ tip ' Ve ' İD ” nitelikler “ olarak ayarlandı veri ' Ve ' bugünün tarihi ' sırasıyla. Bu “ ” etiketi blog boyunca kullanılacaktır. - Sonra, “ içinde
” kimliğine sahip HTML öğesini etiketleyin “ bugünün tarihi ”, “ kullanılarak seçilir. getElementById() ' yöntem. - Bundan sonra “ değerAsTarihi ” özelliği atanır ve yeni bir “ örneği olarak saklanır. Tarih() ” yapıcı.
Yukarıdaki kod parçacığının yürütülmesinden sonra, web sayfası şöyle görünür:
Çıktı, giriş tipi verilerinin geçerli/bugün tarihine ayarlanmış bir varsayılan değere sahip olduğunu gösterir.
Yöntem 2: “toISOString()” Yöntemini Kullanma
“ için varsayılan bugün değerini ayarlamak için giriş ” öğesini bugüne/güncel tarihe. “ toISOString() ” yöntemi de kullanılabilir, daha iyi bir açıklama için aşağıdaki kod parçacığını ziyaret edin:
< senaryo >bugün const = yeni Tarih ( ) .toISOString ( ) .substr ( 0 , 10 ) ;
Document.getElementById ( 'bugünün tarihi' ) .değer = bugün;
senaryo >
Yukarıdaki kod parçacığında:
- İlk olarak, yeni örneği “ Tarih() ” yapıcısı oluşturulur. Bundan sonra, tarihin örneğini “ ISO ” kullanarak standart toISOString() ' yöntem.
- Ardından, “ alt dizi () ” dizin numaralarını alma yöntemi “ 0 ' Ve ' 10 ” parametresi olarak. Bundan sonra, “” dan başlayarak sonucu görüntüler. 0 ” dizinine “ 10 ” dizin.
Yukarıdaki yöntemin yürütülmesinden sonra, web sayfası şöyle görünür:
Çıktı, giriş tipi verilerinin geçerli/bugün tarihine ayarlanmış bir varsayılan değere sahip olduğunu gösterir.
Yöntem 3: “getFullYear()” ve “padStart()” Yöntemlerini Kullanma
Bu bölümde “ GetFullYear() ” yöntemi geçerli tarihi çıkarır. “ yol Başlat() biçimlendirmeye yardımcı olan 'yöntemi kullanılır. tarih ” hedeflenen ekranda görüntülenecek format” giriş ” öğesi:
< senaryo >sabit akım = yeni Tarih ( ) ;
const cari yıl = current.getFullYear ( ) ;
const cari-ay = Dize ( current.getMonth ( ) + 1 ) .padBaşlat ( 2 , '0' ) ;
const geçerli-gün = Dize ( current.getDate ( ) ) .padBaşlat ( 2 , '0' ) ;
const biçimlendirilmişTarih = ` ${cari yıl} - ${cari-ay} - ${geçerli gün} ` ;
const myDateInput = belge.getElementById ( 'benim tarihim' ) ;
myDateInput.value = formattedDate;
senaryo >
Yukarıdaki kod parçacıklarının açıklaması madde işaretlerinde açıklanmıştır:
- İlk olarak, “ nesnesini depolayan sabit bir değişken türü oluşturun. Tarih() ” isimli yapıcı akım ”.
- Ardından, “ GetFullYear() ” yöntemi ile “ akım ” değişkenini seçin ve “ adlı yeni bir değişkende saklayın. Mevcut yıl ”.
- Ardından, “ GetMonth() ” yöntemini seçin ve ayı 1'den 12'ye kadar başlatmak için “ içine bir sayı ekleyin. Sicim() ” yapıcı. Ayrıca “ kullanarak iki karakterlik bir dolgu sağlayın. yolBaşlangıç(2, 0) ”. Ve onu “ adlı yeni oluşturulmuş bir değişkene yerleştirin. içinde bulunduğumuz ay ”.
- Ardından, “ kullanarak geçerli tarihi almak için aynı işlemi izleyin. getDate() ” yöntemini kullanın ve “ içinde saklayın bugün ” değişken.
Kod parçacıklarının yürütülmesinden sonra, web sayfası her durumda şöyle görünür:
Çıktı, giriş tipi verilerinin geçerli/bugün tarihine ayarlanmış bir varsayılan değere sahip olduğunu gösterir.
Çözüm
Giriş tipi tarih varsayılan değerini bugün/geçerli tarih olarak ayarlamak için, “ değerAsTarihi 'mülk,' toISOString() ' Ve ' GetFullYear() ” yöntemleri kullanılabilir. 'valueAsDate' özelliği durumunda, yalnızca ' Tarih() ” durumundayken yapıcıya ihtiyaç vardır. toISOString() ” yöntemleri “ alt dizi () ” yöntemi, tarihin yalnızca belirli bir bölümünü almak için kullanılır. Bu blog, giriş türü tarih varsayılan değerinin bugün/geçerli olarak nasıl ayarlanacağını gösterir.