HTML5 ให้ฟังก์ชั่นการควบคุมปฏิทินและลดเวลาการพัฒนา แต่บางครั้งสไตล์ของมันก็ไม่น่าพอใจจริงๆเราสามารถปรับเปลี่ยนได้ด้วยตัวเองตามรหัสต่อไปนี้
ข้อเสนอแนะ: คัดลอกเซ็กเมนต์รหัสต่อไปนี้และสร้างไฟล์ CSS แยกต่างหากเพื่ออำนวยความสะดวกให้เราแก้ไข
/*แก้ไขประเภทของประเภทการควบคุมปฏิทิน*/:: -webkit-datetime-edit {padding: 1px;}/*ควบคุมพื้นที่การแก้ไข*/:--webkit-dates-feelds-wrapper {พื้นหลัง-สี: #FFF ;;} /*ควบคุมพื้นที่นี้ของปีเดือนเดือนและวัน หรือสั้นหรือสั้นของการควบคุมของปีเดือนและวันเส้นแนวนอน*/:: -webkit-datetime-edit-field {color: #333;}/*ควบคุมข้อความประจำปีเช่นสถานที่ที่ครอบครอง โดยตัวอักษรสี่ตัวในปี 2013* /:: -month-Field {color: #333;} /*เดือนควบคุม* /:: -webkit-Datetime-Day-Field {color: #333;} /*การควบคุมวันที่เฉพาะเจาะจง* /::-webkit-inner- spin-button {การมองเห็น: hidden;} /*นี่คือการควบคุมลูกศรขนาดเล็กของลูกศรด้านบนและล่าง* /:: -webkit-calendar-picker-imenticator { /*นี่คือ การควบคุมลูกศรล่าง* /ชายแดน: 1px Solid #CCC; -gradient (ด้านบน, #f0f0f00, #e6e6e6); 2. ฟังก์ชั่นตรวจสอบวันที่วันที่สิ้นสุดจะไม่น้อยกว่าวันที่เริ่มต้นขอบเขตของการเลือกวันที่คือ 7 วันและช่วงเวลาที่เหลือไม่สามารถใช้งานได้
หมายเหตุ: ส่วนรหัสต่อไปนี้ใช้หลักการ jQuery
// ประเภทเวลาการแปลงเป็นฟังก์ชั่น yyyy-mm-dd formatdate (strtime) {วันที่ var = วันที่ใหม่ (strtime); = (0+ (date.getDate ()). slice (-2); return date.getlyear ()+-+formatedMonth+-+formatedDate;} // เวลาเริ่มต้น $ (#KEYWORD_TIME_MIN) .C haange (ฟังก์ชั่น () { var d1 = วันที่ใหม่ ($ (นี้) .val ()); เวลา +1 ปี d2.setDate (d2.getDate () +7); ); . การเปลี่ยนแปลง (ฟังก์ชั่น () {var d3 = วันที่ใหม่ ($ (นี่) .val ()); var d4 = วันที่ใหม่ (d3); (d4.getDate () -7);ข้างต้นคือรหัสการใช้งานของอินพุต [type = 'date'] รูปแบบที่กำหนดเองและฟังก์ชั่นการตรวจสอบปฏิทินใน HTML5 แนะนำโดย Xiaobian ฉันหวังว่ามันจะเป็นประโยชน์สำหรับทุกคน บรรณาธิการตอบกลับทุกคนในเวลา ขอบคุณมากสำหรับการสนับสนุนเว็บไซต์ Vevb Wulin!