Qanday qilib shakl maydonini bugungi sana va JavaScript yoki JQuery bilan oldindan to'ldirish mumkin
Ko'pgina echimlar har bir shakl yozuvi bilan sanani saqlash imkoniyatini taklif qilsa-da, bu variant bo'lmagan boshqa paytlar ham bor. Biz mijozlarimizni o'z saytlariga yashirin maydon qo'shishni va bu ma'lumotni kirish bilan birga yuborishni taklif qilamiz, shunda ular forma yozuvlari qachon kiritilganligini kuzatishlari mumkin. JavaScript-dan foydalanib, bu oson.
Shakl maydonini bugungi sana va JavaScript bilan qanday to'ldirish mumkin
<!DOCTYPE html>
<html>
<head>
<title>Date Prepopulation with JavaScript</title>
</head>
<body>
<form>
<!-- Hidden field for the date -->
<input type="hidden" id="hiddenDateField" name="hiddenDateField">
</form>
<script>
// Function to get today's date in the desired format
function getFormattedDate() {
const today = new Date();
const formattedDate = today.toLocaleDateString('en-US', {
year: 'numeric',
month: '2-digit',
day: '2-digit'
});
return formattedDate;
}
// Use JavaScript to set the value of the hidden field to today's date
document.getElementById('hiddenDateField').value = getFormattedDate();
</script>
</body>
</html>
Keling, taqdim etilgan HTML va JavaScript kodlarini bosqichma-bosqich ajratamiz:
<!DOCTYPE html>
va<html>
: Bu HTML5 hujjati ekanligini ko'rsatuvchi standart HTML hujjat deklaratsiyasi.<head>
: Bu boʻlim odatda hujjat haqidagi metamaʼlumotlarni, masalan, veb-sahifaning sarlavhasi yordamida oʻrnatiladi.<title>
element.<title>
: Bu veb-sahifaning sarlavhasini “JavaScript yordamida sanadan oldin populyatsiya” qilib belgilaydi.<body>
: Bu veb-sahifaning ko'rinadigan kontent va foydalanuvchi interfeysi elementlarini joylashtirgan asosiy kontent maydoni.<form>
: Kirish maydonlarini o'z ichiga olishi mumkin bo'lgan shakl elementi. Bunday holda, u bugungi sana bilan to'ldiriladigan yashirin kiritish maydonini o'z ichiga olish uchun ishlatiladi.<input type="hidden" id="hiddenDateField" name="hiddenDateField">
: Bu yashirin kiritish maydoni. U sahifada ko'rinmaydi, lekin ma'lumotlarni saqlashi mumkin. JavaScript-da identifikatsiyalash va foydalanish uchun unga “hiddenDateField” identifikatori va “hiddenDateField” nomi berilgan.<script>
: Bu JavaScript skript blokining ochilish yorligʻi boʻlib, u yerda JavaScript kodini yozishingiz mumkin.function getFormattedDate() { ... }
: Bu JavaScript funksiyasini belgilaydigetFormattedDate()
. Ushbu funktsiya ichida:- U yangisini yaratadi
Date
joriy sana va vaqtni ifodalovchi ob'ekt yordamidaconst today = new Date();
. - U sanani kerakli formatda (aa/dd/yyyy) qatorga formatlaydi
today.toLocaleDateString()
. The'en-US'
argument formatlash uchun mahalliy (Amerika ingliz tili) va ob'ektni belgilaydiyear
,month
vaday
xususiyatlar sana formatini belgilaydi.
- U yangisini yaratadi
return formattedDate;
: Bu qator formatlangan sanani satr sifatida qaytaradi.document.getElementById('hiddenDateField').value = getFormattedDate();
: Ushbu kod qatori:- foydalanish
document.getElementById('hiddenDateField')
“hiddenDateField” identifikatori bilan yashirin kiritish maydonini tanlash uchun. - O'rnatadi
value
tomonidan qaytarilgan qiymatga tanlangan kirish maydonining xususiyatigetFormattedDate()
funktsiyasi. Bu yashirin maydonni belgilangan formatda bugungi sana bilan to'ldiradi.
- foydalanish
Yakuniy natija shundan iboratki, sahifa yuklanganda “hiddenDateField” identifikatoriga ega yashirin kiritish maydonida ko‘rsatilgandek, bosh nolsiz mm/dd/yyyy formatidagi bugungi sana to‘ldiriladi. getFormattedDate()
funktsiyasi.
Qanday qilib shakl maydonini bugungi sana va jQuery bilan oldindan to'ldirish mumkin
<!DOCTYPE html>
<html>
<head>
<title>Date Prepopulation with jQuery and JavaScript Date Object</title>
<!-- Include jQuery from a CDN -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<form>
<!-- Hidden field for the date -->
<input type="hidden" id="hiddenDateField" name="hiddenDateField">
</form>
<script>
// Use jQuery to set the value of the hidden field to today's date
$(document).ready(function() {
const today = new Date();
const formattedDate = today.toLocaleDateString('en-US', {
year: 'numeric',
month: '2-digit',
day: '2-digit'
});
$('#hiddenDateField').val(formattedDate);
});
</script>
</body>
</html>
Ushbu HTML va JavaScript kodi amm/dd/yyyy sifatida formatlangan, bosh nolsiz bugungi sana bilan yashirin kiritish maydonini oldindan to'ldirish uchun jQuery-dan qanday foydalanishni ko'rsatadi. Keling, uni bosqichma-bosqich ajratamiz:
<!DOCTYPE html>
va<html>
: Bu HTML5 hujjati ekanligini ko'rsatadigan standart HTML hujjat deklaratsiyalari.<head>
: Ushbu bo'lim veb-sahifa uchun metadata va resurslarni kiritish uchun ishlatiladi.<title>
: Veb-sahifa sarlavhasini “jQuery va JavaScript sanasi ob’ekti yordamida sanadan oldin joylashtirish” qilib o‘rnatadi.<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
: Bu qator jQuery kutubxonasini kontentni yetkazib berish tarmog'idan (CDN) manbasini ko'rsatish orqali o'z ichiga oladi. Bu jQuery kutubxonasi veb-sahifada foydalanish uchun mavjudligini ta'minlaydi.<body>
: Bu veb-sahifaning ko'rinadigan kontent va foydalanuvchi interfeysi elementlarini joylashtirgan asosiy kontent maydoni.<form>
: Kirish maydonlarini o'z ichiga olgan HTML forma elementi. Bunday holda, u yashirin kirish maydonini qamrab olish uchun ishlatiladi.<input type="hidden" id="hiddenDateField" name="hiddenDateField">
: Veb-sahifada ko'rinmaydigan yashirin kiritish maydoni. Unga “hiddenDateField” identifikatori va “hiddenDateField” nomi berilgan.<script>
: Bu JavaScript kodini yozishingiz mumkin bo'lgan JavaScript skript blokining ochilish yorlig'i.$(document).ready(function() { ... });
: Bu jQuery kod blokidir. dan foydalanadi$(document).ready()
sahifa to'liq yuklangandan so'ng, mavjud kodning ishlashini ta'minlash funktsiyasi. Ushbu funktsiya ichida:const today = new Date();
yangisini yaratadiDate
joriy sana va vaqtni ifodalovchi ob'ekt.const formattedDate = today.toLocaleDateString('en-US', { ... });
yordamida sanani kerakli formatdagi (aa/dd/yyyy) qatorga formatlayditoLocaleDateString
usuli.
$('#hiddenDateField').val(formattedDate);
jQuery yordamida yashirin kirish maydonini "hiddenDateField" identifikatori bilan tanlaydi va uni o'rnatadi.value
formatlangan sanaga. Bu ko'rsatilgan formatdagi bugungi sana bilan yashirin maydonni samarali tarzda oldindan to'ldiradi.
JQuery kodi sof JavaScript bilan solishtirganda yashirin kiritish maydonini tanlash va o'zgartirish jarayonini soddalashtiradi. Sahifani yuklaganda, yashirin kiritish maydoni mm/dd/yyyy formatida bugungi sana bilan to'ldiriladi va yorliqda ko'rsatilganidek, hech qanday bosh nol mavjud emas. formattedDate
o'zgaruvchan.