Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk menyemak sama ada tarikh input sama dengan tarikh hari ini menggunakan JavaScript?

Bagaimana untuk menyemak sama ada tarikh input sama dengan tarikh hari ini menggunakan JavaScript?

王林
王林ke hadapan
2023-08-26 15:33:121251semak imbas

如何使用 JavaScript 检查输入日期是否等于今天的日期?

Dalam tutorial ini, kita belajar untuk menyemak sama ada tarikh input sama dengan tarikh hari ini atau tidak menggunakan JavaScript. Kadangkala kita perlu mendapatkan tarikh pengguna daripada medan input dalam pelbagai format dan menyemak sama ada tarikh input dan tarikh hari ini sepadan.

Di sini kita akan mempelajari dua kaedah untuk menyemak sama ada tarikh input sama dengan tarikh hari ini.

Bandingkan tahun, bulan dan hari masing-masing

Pengguna boleh mendapatkan tahun, bulan dan tarikh lengkap daripada cap waktu objek Tarikh menggunakan pelbagai kaedah seperti getFullYear(), getMonth() dan getDate(). Selain itu, kita boleh mendapatkan tahun, bulan dan tarikh dengan memisahkan rentetan yang dimasukkan pengguna dengan pembatas.

Selepas itu, kami boleh membandingkan tahun, bulan dan hari dua cap waktu untuk menyemak sama ada tarikh input sama dengan tarikh hari ini.

Tatabahasa

Pengguna boleh mengikut sintaks di bawah untuk memadankan sama ada tarikh input sama dengan tarikh hari ini.

let inputYear = dateInput.value.split("/")[0];
let inputMonth = dateInput.value.split("/")[1];
let inputDate = dateInput.value.split("/")[2];
if (current_date.getFullYear() == inputYear && current_date.getMonth() == inputMonth - 1 && current_date.getDate(); == inputDate) {
   // date is equal to today’s date
} else{
   // date is not equal to today’s date
}

Dalam sintaks di atas, selepas membelah rentetan input dengan "/", kami mendapat tatasusunan yang mengandungi tiga nilai. Nilai pertama ialah tahun, nilai kedua ialah bulan, dan nilai ketiga ialah hari.

Algoritma

Pengguna boleh mengikuti algoritma berikut.

  • Langkah 1 - Dapatkan tarikh daripada pengguna dalam format tertentu.

  • Langkah 2 - Pisahkan rentetan tarikh dan ekstrak tahun, bulan dan tarikh. Di sini, kami menggunakan kaedah split() JavaScript untuk memisahkan rentetan tarikh.

  • Langkah 3 - Gunakan pembina Date() baharu untuk mencipta tarikh bersamaan dengan tarikh hari ini.

  • Langkah 4 - Ekstrak tahun, bulan dan tarikh dari tarikh hari ini menggunakan kaedah getFullYear(), getMonth() dan getDate().

    李>
  • Langkah 5 - Bandingkan tahun, bulan dan tarikh dua cap masa. Kaedah getMonth() mengembalikan bulan antara 0 dan 11. Jadi kita perlu membandingkan bulan dengan inputBulan – 1.

  • Langkah 6 - Jika ketiga-tiga sifat kedua-dua tarikh sepadan, maka tarikh input adalah sama dengan tarikh hari ini.

Contoh

Dalam contoh di bawah, kami telah mencipta fungsi compareDate(). Apabila pengguna menekan butang hantar dan memasukkan rentetan tarikh dalam medan input, ia memanggil fungsi compareDate().

Fungsi

compareDate() melaksanakan algoritma di atas untuk menyemak sama ada tarikh input sama dengan tarikh hari ini.

<html>
<body>
   <h3>Comparing the <i>date, month, and year</i> separately to check if input the date is equal to today's date </h3>
   <h4>Enter the date in yyyy/mm/dd format.</h4>
   <input type="text" id="dateInput" />
   <button id = "submit" onclick = "compareDate()"> submit </button>
   <p id = "output"> </p>
   <script>
      let output = document.getElementById("output");
      let dateInput = document.getElementById("dateInput");
      function compareDate() {
         // split the input string
         let inputYear = dateInput.value.split("/")[0];
         let inputMonth = dateInput.value.split("/")[1];
         let inputDate = dateInput.value.split("/")[2];

         let current_date = new Date();
         // get the month, year, and date from the time stamp
         let year = current_date.getFullYear();
         let month = current_date.getMonth();
         let day = current_date.getDate();
         // compare year, month, and date
         if (year == inputYear && month == inputMonth - 1 && day == inputDate) {
            output.innerHTML = "Date is equal to today's date!";
         } else {
            output.innerHTML = "Date is not equal to today's date!";
         }
      }
   </script>
</body>
</html>

Gunakan kaedah toDateString()

Kita boleh menggunakan kaedah toDateString() dengan cap waktu objek Date, yang hanya mengembalikan rentetan tarikh dalam cap masa.

Kami boleh mencipta cap masa baharu objek Tarikh menggunakan sebarang nilai yang kami peroleh daripada input pengguna dan mendapatkan rentetan tarikh menggunakan kaedah toDateString(). Seterusnya, kita juga boleh mencipta tarikh semasa yang mewakili tarikh hari ini dan menggunakan kaedah toDateString().

Akhir sekali, kita boleh membandingkan rentetan tarikh dua cap waktu.

Tatabahasa

Pengguna boleh menggunakan kaedah toDateString() mengikut sintaks berikut untuk menyemak sama ada input adalah sama dengan tarikh hari ini.

let [year, month, date] = dateInput.value.split(",");
let inputDate = new Date(year, month - 1, date);
let current_date = new Date();
if (inputDate.toDateString() == current_date.toDateString()) {
   // it’s today’s date.
} else {
   // It’s not matching with today’s date
}

Dalam sintaks di atas, kami telah mencipta cap masa tarikh input menggunakan nilai tahun, bulan – 1 dan tarikh. Memandangkan objek Tarikh mempunyai nilai bulan antara 0 dan 11, kami perlu menyediakan bulan - 1.

Contoh

Contoh berikut mendapat rentetan tarikh daripada pengguna dalam medan input teks dalam format tertentu. Selepas itu, kami mengekstrak tahun, bulan dan tarikh daripada rentetan dan mencipta tarikh baharu.

Seterusnya, kami membandingkan rentetan tarikh dua cap masa.

<html>
<body>
   <h3>Using the <i> toDateString() </i> method to check if input the date is equal to today's date </h3>
   <h4>Enter the date in yyyy,mm,dd format.</h4>
   <input type = "text" id = "dateInput" />
   <button id = "submit" onclick = "compareDate()"> submit </button>
   <p id = "output"> </p>
   <script>
      let output = document.getElementById("output");
      let dateInput = document.getElementById("dateInput");
      function compareDate() {
         // extract the year, month, and date
         let [year, month, date] = dateInput.value.split(",");
         let inputDate = new Date(year, month - 1, date);
         let current_date = new Date();
         if (inputDate.toDateString() == current_date.toDateString()) {
            output.innerHTML = "Date is equal to today's date!";
         } else {
            output.innerHTML = "Date is not equal to today's date!";
         }
      }
   </script>
</body>
</html>

Dalam output di atas, pengguna boleh melihat bahawa memasukkan tarikh dalam format yang tidak sah akan menghasilkan ralat dalam konsol.

Pengguna mempelajari dua cara untuk menyemak sama ada tarikh sama dengan tarikh hari ini. Walau bagaimanapun, pengguna juga boleh menggunakan kaedah setHours(). Kita boleh menetapkan jam kepada 0 dalam objek tarikh dan membandingkannya dengan tarikh hari ini untuk menyemak kesamaan.

Atas ialah kandungan terperinci Bagaimana untuk menyemak sama ada tarikh input sama dengan tarikh hari ini menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Artikel ini dikembalikan pada:tutorialspoint.com. Jika ada pelanggaran, sila hubungi admin@php.cn Padam