Girdi türü tarihi ve ayrıca iç sıkma okları için geçmiş tarihleri ​​devre dışı bırakın

Question

Aşağıdaki komutları kullanarak geçmişteki tarihleri ​​devre dışı bıraktım. Ancak, geçmiş dönemleri iç-spin oklarında devre dışı bırakamıyorum.

Birçok arama sonucu sadece iç döndürme oklarını gizlemek için gösterilir; İç-spin oklarını gizlemek istemiyorum. İç-dönüş oklarındaki geçmiş tarihleri ​​devre dışı bırakmak mümkün mü?

//disable past dates 
var today = new Date().toISOString().split('T')[0]; 
document.getElementsByName("dateField")[0].setAttribute('min', today); 

//hide inner-spin arrows 
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
-webkit-appearance: none; margin:0; 
} 

Answer 1

Buradaki sorunlardan biri, fikir temelli bir ideal haline gelen "en iyi davranış nedir". Öyleyse, tarihi bugünden önceki NEXT yılına ayarlarsanız, YIL bu yıl için değiştirin, diğer kısımlar ne yapmalı? Bu, düşünmeye dayalı bölüm ve manipüle etmek istediğiniz "davranış modeli" dir. O zaman odak kaybolduktan sonra elle manuel olarak işlemek gerekir. adımların

Örnek yukarıda çoğaltmak için:

1. Set tarih min/maks: <input id="when" type="date" min="2016-04-06" max="2099-12-31" />
2. Değişim 2017 için yıl
3. Değişim 01 ay ve gün her ikisi (1 Ocak 2017)
4. Değişim eğiren kullanarak 2016 için yıl
5. tarihi 01/01/2016

olarak gösterir

Şimdi, ayarlarınıza göre geçersiz bir tarih ayarladınız. Odağı kaybetmenizin ardından bunu saptamanız gerekecek, daha sonra bu tarih geçerliliği sorununu uygun bir şekilde yönetmelisiniz - ilk (asgari) tarihe geri yerleştirir misiniz? Geçerli bir tarihe sahip olan sonraki YIL'a mı? O gün nerede geçerli olacak? Buradaki zorlukların, bunlardan herhangi birinin sizin arzu ettiğiniz davranışınız olabileceğidir, ancak bu benim arzu edilen davranışım olmayabilir (ikimizin de farklı görüşleri vardır).

DÜZENLEME: Giriş olay tetiğe SİZİN minimuma ayarlayın:

var inputMyDate = document.querySelector('input#when'); 

inputMyDate.addEventListener('input', function() { 
    var current = this.value; 
    var min = input.getAttribute("min"); 
    if (new Date(current) < new Date(min)) { 
    var setmin = new Date(min).toISOString().split('T')[0]; 
    this.value = setmin; 
    } 
}); 

Answer 2

Bu kod size yardımcı olabilir:

<form action="demo_form.asp"> 
Enter a date before 1980-01-01: 
<input type="date" name="bday" max="1979-12-31"><br> 

Enter a date after 2000-01-01: 
<input type="date" name="bday" min="2016-12-25"><br> 

Quantity (between 1 and 5): 
<input type="number" name="quantity" min="1" max="5"><br> 

<input type="submit"> 
</form>