Bắt Lỗi Form đăng Ký Bằng Javascript - Songmaweb
Có thể bạn quan tâm
Bắt lỗi Form (Validate Form) thường được sử dụng khi xây dựng ứng dụng web. Đối với một số website như Forum, diễn đàn, thương mại điện tử đều phải có chức năng này. Khi đưa ra một số điều kiện bằng ngôn ngữ JavaScript sẽ hạn chế người dùng nhập các thông tin không chính xác.
Một Form đăng ký sử dụng HTML cơ bản thường là điền tên đăng nhập và mật khẩu. Đối với một lập trình viên thiết kế website thì phải am hiểu về điều này. Bài viết sau đây sẽ hướng dẫn kiểm tra form hợp lệ trong JavaScript chi tiết.
Mục lục
- Bắt lỗi/ Validate Form đăng ký bằng JavaScript
- Validate Form chỉ nhập số trong JavaScript
Bắt lỗi/ Validate Form đăng ký bằng JavaScript
Tạo ra một tạo form đăng ký bằng HTML và Javascript tên là dangky.html
<html> <head> <title>Ví dụ Form đăng ký JavaScript</title> </head> <body> <form name="form1" method="post" action="" onsubmit="return validateform()"> Name: <input type="text" name="name"><br> Password: <input type="password" name="password"><br> <input type="submit" value="register"> </form> <script> function validateform() { var name = document.form1.name.value; var password = document.form1.password.value; if (name == null || name == "") { alert("Tên đăng nhập không được để trống!"); return false; } else if (password.length < 6) { alert("Mật khẩu ít nhất 6 ký tự"); return false; } } </script> </body> </html>Khi nhấp vào Submit sẽ xuất hiện ra một cảnh báo
Giải thích:
Trong Function chúng ta sẽ đặt các điều kiện như:
if (name == null || name == “”) { alert(“Tên đăng nhập không được để trống!”); return false;
Nếu tên “trống” thì sẽ xuất hiện ô cảnh báo và quay trở lại.
else if (password.length < 6) { alert(“Mật khẩu ít nhất 6 ký tự”); return false; }
Nếu mật khẩu nhỏ hơn 6 ký tự thì xuất hiện ô cảnh báo và quay lại.
Validate Form chỉ nhập số trong JavaScript
Sử dụng hàm isNaN điều kiện chỉ nhập số vào ô:
<script> function validate() { var num = document.form2.nhapso.value; if (isNaN(num)) { document.getElementById("so").innerHTML = "Chỉ được nhập số."; return false; } else { return true; } } </script> <form name="form2" onsubmit="return validate()"> Nhập số: <input type="text" name="nhapso"><span id="so"></span><br> <input type="submit" value="submit"> </form>Trên đây chúng tôi vừa giới thiệu đến bạn 2 cách Validate Form trong JavaScript thường sử dụng. Ứng dụng của nó sử dụng để kiểm tra tên đăng nhập, số điện thoại, mật khẩu, email vv…
JavaScriptTừ khóa » Form Liên Hệ Bằng Javascript
-
32 Contact Form HTML Cho Thiết Kế Website - Niềm Vui Lập Trình
-
Hướng Dẫn Tạo Form Liên Hệ Bằng HTML, CSS - Quách Quỳnh
-
Tạo Form đăng Ký Bằng Javascript - Quách Quỳnh
-
Hướng Dẫn Tạo Contact Form đơn Giản Với CSS - Freetuts
-
Cách Tạo Form đăng Ký Bằng Javascript - Đại Bàng
-
Xây Dựng Một Form Liên Hệ Bootstrap Sử Dụng PHP Và AJAX
-
Tạo Form Liên Hệ Với Contactable - NTuts
-
Gửi Email Bằng HTML Và - Complete JavaScript
-
DOM Tutorial - Làm Chức Năng Kiểm Tra Thông Tin Của Form
-
Tạo Form Liên Hệ Có đính Kèm File Sử Dụng Php Và Ajax
-
Tạo Form Liên Hệ Wordpress đơn Giản Với Contact Form 7
-
How To Create A Contact Form With CSS - W3Schools
-
Kiểm Tra Dữ Liệu Trong Form Với Javascript - Thầy Long Web
-
Form Validation Kiểm Tra Dữ Liệu Dom - JavaScript