Thuộc tính novalidate HTML xác định rằng trong khi gửi biểu mẫu, dữ liệu biểu mẫu sẽ không được xác thực trong tài liệu HTML.
Cú pháp
Sau đây là cú pháp -
<form novalidate></form>
Hãy để chúng tôi xem một ví dụ về Thuộc tính không hợp lệ của HTML -
Ví dụ
<!DOCTYPE html>
<html>
<style>
body {
color: #000;
height: 100vh;
background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) no-repeat;
text-align: center;
}
input[type='text'] {
width: 300px;
padding: 8px 16px;
border: 2px solid #fff;
background: transparent;
border-radius: 20px;
display: block;
margin: 1rem auto;
outline: none;
}
.btn {
background: #db133a;
border: none;
height: 2rem;
border-radius: 20px;
width: 330px;
display: block;
color: #fff;
outline: none;
cursor: pointer;
margin: 1rem auto;
}
::placeholder {
color: #000;
}
</style>
<body>
<h1>HTML novalidate attribute Demo</h1>
<form>
<input type="text" placeholder="Enter your name" required>
<input type="submit" value="Submit" class="btn" onclick='check()'>
</form>
<button type='button' class="btn" onclick="set()">Set No Validation</button>
<div class="show"></div>
<script>
function set() {
document.querySelector('form').setAttribute('novalidate', 'true');
}
</script>
</body>
</html> Đầu ra
Cố gắng nhấp vào nút “Gửi” mà không nhập bất kỳ tên nào vào trường văn bản, nó sẽ tạo ra một thông báo cảnh báo -
Bây giờ hãy nhấp vào “ Đặt Không xác thực ”Để đặt không hợp lệ thuộc tính trên phần tử biểu mẫu và bây giờ hãy cố gắng gửi biểu mẫu mà không nhập bất kỳ tên nào vào trường văn bản, lần này nó sẽ dễ dàng được gửi mà không hiển thị bất kỳ thông báo cảnh báo nào
-
