Ինչպես համալրել ձևի դաշտը այսօրվա ամսաթվով և JavaScript-ով կամ JQuery-ով
Թեև շատ լուծումներ հնարավորություն են տալիս պահելու ամսաթիվը յուրաքանչյուր ձևի մուտքի հետ, կան այլ դեպքեր, երբ դա տարբերակ չէ: Մենք խրախուսում ենք մեր հաճախորդներին ավելացնել թաքնված դաշտ իրենց կայքում և փոխանցել այս տեղեկատվությունը մուտքի հետ միասին, որպեսզի կարողանան հետևել, թե երբ են մուտքագրվում ձևաթղթերը: Օգտագործելով JavaScript, դա հեշտ է:
Ինչպես վերաբնակեցնել ձևի դաշտը այսօրվա ամսաթվով և JavaScript-ով
<!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>
Եկեք քայլ առ քայլ բաժանենք տրամադրված HTML և JavaScript կոդը.
<!DOCTYPE html>
և<html>
Սրանք ստանդարտ HTML փաստաթղթերի հայտարարություններ են, որոնք նշում են, որ սա HTML5 փաստաթուղթ է:<head>
Այս բաժինը սովորաբար օգտագործվում է փաստաթղթի վերաբերյալ մետատվյալներ ներառելու համար, օրինակ՝ վեբ էջի վերնագիրը, որը սահմանվում է օգտագործելով<title>
տարր.<title>
: Սա սահմանում է վեբ էջի վերնագիրը «JavaScript-ով նախաբնակեցման ամսաթվերը»:<body>
Սա վեբ էջի հիմնական բովանդակության տարածքն է, որտեղ դուք տեղադրում եք տեսանելի բովանդակությունը և օգտագործողի միջերեսի տարրերը:<form>
Ձևի տարր, որը կարող է պարունակել մուտքային դաշտեր: Այս դեպքում այն օգտագործվում է պարունակելու թաքնված մուտքագրման դաշտը, որը լրացվելու է այսօրվա ամսաթվով:<input type="hidden" id="hiddenDateField" name="hiddenDateField">
Սա թաքնված մուտքագրման դաշտ է: Այն չի երևում էջում, բայց կարող է տվյալներ պահել: Դրան տրվում է «hiddenDateField» ID-ն և «hiddenDateField»-ի անունը՝ նույնականացման և JavaScript-ում օգտագործելու համար:<script>
Սա JavaScript սցենարի բլոկի բացման պիտակն է, որտեղ կարող եք գրել JavaScript կոդ:function getFormattedDate() { ... }
Սա սահմանում է JavaScript ֆունկցիան, որը կոչվում էgetFormattedDate()
. Այս ֆունկցիայի ներսում.- Այն ստեղծում է նոր
Date
օբյեկտ, որը ներկայացնում է ընթացիկ ամսաթիվը և ժամը, օգտագործելովconst today = new Date();
. - Այն ֆորմատավորում է ամսաթիվը ցանկալի ձևաչափով (մմ/դդ/տտտ) տողի՝ օգտագործելով
today.toLocaleDateString()
. The'en-US'
արգումենտը սահմանում է ֆորմատավորման տեղայնությունը (ամերիկյան անգլերեն) և օբյեկտըyear
,month
, եւday
հատկությունները սահմանում են ամսաթվի ձևաչափը:
- Այն ստեղծում է նոր
return formattedDate;
Այս տողը վերադարձնում է ձևաչափված ամսաթիվը որպես տող:document.getElementById('hiddenDateField').value = getFormattedDate();
: Կոդի այս տողը.- Օգտագործում
document.getElementById('hiddenDateField')
ընտրելու թաքնված մուտքագրման դաշտը «hiddenDateField» ID-ով: - Սահմանում է
value
ընտրված մուտքագրման դաշտի հատկությունը՝ վերադարձված արժեքինgetFormattedDate()
ֆունկցիան։ Սա լրացնում է թաքնված դաշտը այսօրվա ամսաթվով նշված ձևաչափով:
- Օգտագործում
Վերջնական արդյունքն այն է, որ երբ էջը բեռնվում է, «hiddenDateField» ID-ով թաքնված մուտքագրման դաշտը լրացվում է այսօրվա ամսաթվով mm/dd/yyyy ձևաչափով՝ առանց սկզբնական զրոյի, ինչպես նշված է getFormattedDate()
գործառույթը:
Ինչպես վերաբնակեցնել ձևի դաշտը այսօրվա ամսաթվով և jQuery-ով
<!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>
Այս HTML և JavaScript կոդը ցույց է տալիս, թե ինչպես կարելի է օգտագործել jQuery թաքնված մուտքագրման դաշտը այսօրվա ամսաթվով նախապես համալրելու համար՝ ձևաչափված որպես մմ/dd/yyyy, առանց սկզբնական զրոյի: Եկեք բաժանենք այն քայլ առ քայլ.
<!DOCTYPE html>
և<html>
Սրանք ստանդարտ HTML փաստաթղթերի հայտարարություններ են, որոնք ցույց են տալիս, որ սա HTML5 փաստաթուղթ է:<head>
Այս բաժինը օգտագործվում է վեբ էջի մետատվյալների և ռեսուրսների ներառման համար:<title>
Սահմանում է վեբ էջի վերնագիրը «Date Prepopulation with jQuery and JavaScript Date Object»:<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
Այս տողը ներառում է jQuery գրադարանը՝ նշելով դրա աղբյուրը բովանդակության առաքման ցանցից (CDN): Այն ապահովում է, որ jQuery գրադարանը հասանելի է վեբ էջում օգտագործման համար:<body>
Սա վեբ էջի հիմնական բովանդակության տարածքն է, որտեղ դուք տեղադրում եք տեսանելի բովանդակությունը և օգտագործողի միջերեսի տարրերը:<form>
HTML ձևի տարր, որն օգտագործվում է մուտքագրման դաշտեր պարունակելու համար: Այս դեպքում այն օգտագործվում է թաքնված մուտքագրման դաշտը ամփոփելու համար:<input type="hidden" id="hiddenDateField" name="hiddenDateField">
Թաքնված մուտքագրման դաշտ, որը տեսանելի չի լինի վեբ էջում: Դրան հատկացվել է «hiddenDateField» ID-ն և «hiddenDateField»-ի անունը:<script>
Սա JavaScript սցենարի բլոկի բացման պիտակն է, որտեղ կարող եք գրել JavaScript կոդ:$(document).ready(function() { ... });
Սա jQuery կոդի բլոկ է: Այն օգտագործում է$(document).ready()
գործառույթ՝ ապահովելու, որ պարունակվող կոդը գործարկվի էջն ամբողջությամբ բեռնվելուց հետո: Այս ֆունկցիայի ներսում.const today = new Date();
ստեղծում է նորDate
օբյեկտ, որը ներկայացնում է ընթացիկ ամսաթիվը և ժամը:const formattedDate = today.toLocaleDateString('en-US', { ... });
ձևաչափում է ամսաթիվը ցանկալի ձևաչափով (մմ/դդ/տտտ) տողի՝ օգտագործելովtoLocaleDateString
մեթոդ է.
$('#hiddenDateField').val(formattedDate);
jQuery-ի միջոցով ընտրում է թաքնված մուտքագրման դաշտը «hiddenDateField» ID-ով և սահմանում դրաvalue
մինչև ձևաչափված ամսաթիվը: Սա արդյունավետորեն նախապես համալրում է թաքնված դաշտը այսօրվա ամսաթվով նշված ձևաչափով:
jQuery կոդը պարզեցնում է թաքնված մուտքագրման դաշտի ընտրության և փոփոխման գործընթացը մաքուր JavaScript-ի համեմատ: Երբ էջը բեռնվում է, թաքնված մուտքագրման դաշտը լրացվում է այսօրվա ամսաթվով mm/dd/yyyy ձևաչափով, և սկզբնական զրոներ չկան, ինչպես նշված է formattedDate
փոփոխական: