HTML5 ?? ??? ?? ??? ???? ??? ??? ???????? ???????

HTML5? JavaScript?? ??? ??? ??? ???? ? ??? ??? ? ?? ??? ??? ?????. ? HTML5 ?? ?? ??? ????? HTML ?? ??? ???????. ??? ? ??? ??? ??? ????.

1. ?? ?? : required ??? ??? ???? ?? ??? ???????. ??? ??, TextAreas ?? Select? ?? ?? ?? ???? ?? ? ? ????. ?? ??:

    <code class="html"><input type="text" name="username" required></code>

2. ?? ?? : pattern ??? ???? ???? ??? ?? ???? ?? ???? ??? ? ????. ??? ?? ??, ??? ?? ?? ?? ??? ???? ? ?????.

    <code class="html"><input type="text" name="phone" pattern="[0-9]{3}-[0-9]{3}-[0-9]{4}" title="Please enter a phone number in the format XXX-XXX-XXXX"></code>

3. ?? ? ?? ?? : ??? ??? ?? ?? ?? ( number , range , date ?)? ?? ???? ???? ?? ? ??? ?? ? ?? ?? ??? ? ????. ?? ??:

    <code class="html"><input type="number" name="age" min="18" max="100"></code>

4. MaxLength ? Minlength ?? : ??? ??? ???? ?? ??? ?? ? ??? ?? ? ?? ??? ??? ??? ? ????. ?? ??:

    <code class="html"><input type="password" name="password" minlength="8" maxlength="20"></code>

??? ??? ???? ?? ???? ???? ?? ?????? ?? ?? ??? ????? ??? ? ????.

??? ??? ??? ?? ??? HTML5 ?? ??? ??????

HTML5? ?? ??? ??? ?? ??? ???? ?? ??? ??? ?? ? ??? ??? ?? ??? ?????. HTML5 ?? ??? ?? ??? ??? ????.

1. ?? : ??? ?? ? ? ??????.
2. ?? : ??? ??? ???? ?? ?? ???? ??? ? ????.
3. ?? ? ?? : ?? ? ?? ?? ??? ?? ???? ???? ?? ? ??? ?? ? ?? ?? ?????.
4. MaxLength ? Minlength : ?? ??? ?? ? ??? ?? ? ?? ??? ??????.
5. ?? : ????? number ?? range ?? ??? ?? ???? ?? ??? ?? ?? ??? ?????.
6. ?? : type ?? ??? ??? ??? ?? ? ? ???? (? : type="email" ?? type="url" ?? ??? ?? ?? URL? ??? ???? ?????.

??? ??? ?????? ??? ??? ?? ???? ??? ??? ????? ?? ? ??? ????? ??? ??? ??? ?????.

HTML5 ?? ??? ?? ?? ???? ??? ????? ?????????

HTML5? ???? title ?? ?? ??? ?? JavaScript? ???? ??? ??? ?? ? ? ???? ?? ???? ??? ?? ? ? ????. ??? ? ??? ??? ??? ????.

1. ?? ?? ?? : ?? ???? ??? ???? ?? ??? ??? pattern ??? ?? title ??? ???? ????. title ??? pattern ???? ?? ? ????? ?? ???? ??? ??? ??? ??? ?????. ?? ??:

    <code class="html"><input type="text" name="username" pattern="[A-Za-z]{3,}" title="Username must be at least 3 letters and contain only letters"></code>

2. JavaScript ?? :?? ??? ????? ????? ?? ???? ? ?? ?? ???? ?? JavaScript? ???? ??? ?? ???? ??? ?? ? ? ????. ??? submit ???? ????? ? ??? ???? ???? setCustomValidity ???? ???? ??? ?? ???? ??? ? ????. ?? ??:

    <code class="javascript">document.getElementById('myForm').addEventListener('submit', function(event) { if (!event.target.checkValidity()) { event.preventDefault(); var elements = event.target.elements; for (var i = 0; i </code>

?? ?? ????? ??? ?? ???? ???? ?? ??? ??? ???? ? ????.

?? ??? ?? ????? ?? HTML5 ?? ??? JavaScript? ?? ? ? ?????

?, HTML5 ?? ??? JavaScript? ?????? ??? ?? ????? ?? ? ? ??????. HTML5 ??? ?? ????? ?? ???? ????? JavaScript??? ??? ?? ?? ? ??? ??? ??? ???? ?????. ???? ???? ??? ??? ????.

1. ?? ??? ?? ? HTML5 : ?? ??? ?? ??? HTML5 ??? ???? ???? JavaScript ??? ???? ?? ?? ?? ??? ????? ??????.
2. ?? ??? ????? JavaScript : JavaScript? ???? HTML5 ??? ?? ? ??? ? ??? ?? ??? ??? ??????. ???? ??????? ?? ??, ?? ???? ?? ??? ????? ?? ???? ? ??? ??? ???? ?? ??? ? ????.

3. ?? ??? ?? : HTML5? JavaScript ??? ??? ????? JavaScript? ?? submit ?????? ? ????. HTML5 ??? ??? ???? ?? ?? (?? ??)? ?????. ?? ?? JavaScript ??? ?? ??? ??? ? ????.

    <code class="javascript">document.getElementById('myForm').addEventListener('submit', function(event) { if (!event.target.checkValidity()) { event.preventDefault(); // Handle HTML5 validation errors } else { // Perform additional JavaScript validation if (!moreComplexValidation()) { event.preventDefault(); // Show custom error messages } } }); function moreComplexValidation() { // Example of complex validation logic var password = document.getElementById('password').value; var confirmPassword = document.getElementById('confirmPassword').value; if (password !== confirmPassword) { document.getElementById('confirmPassword').setCustomValidity('Passwords do not match'); return false; } return true; }</code>

HTML5? JavaScript? ???? ? ?? ??? ???? ???? ??? ????? ???? ??? ?? ? ??? ???? ????? ??? ?? ?? ???? ?? ? ? ????.

? ??? HTML5 ?? ??? ?? ??? ???? ??? ??? ???????? ???????? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!