HTML5: Practical 16

Các khóa học qua video:
Python SQL Server PHP C# Lập trình C Java HTML5-CSS3-JavaScript
Học trên YouTube <76K/tháng. Đăng ký Hội viên
Viết nhanh hơn - Học tốt hơn
Giải phóng thời gian, khai phóng năng lực

Tạo một biểu mẫu mua hàng trực tuyến như hình vẽ sau:

https://lh3.googleusercontent.com/-Qa-pxAXT_2s/Va93DBH3CrI/AAAAAAAAA0Y/GfEGyggvwXU/s576-Ic42/hdj-practical-16.png

Hình 1

-Hãy thực hiện việc kiểm tra dữ liệu như sau:

  • Nếu người sử dụng không điền thông tin vào các trường: Họ và tên đệm, Tên, Địa chỉ, Thành phố
  • Số điện thoại phải điền theo mẫu: (034) 344-5555
  • Nếu người sử dụng chưa check vào ô: Chọn vào đây nếu địa chỉ của bạn khác với địa chỉ đã điền trong email thì ô text bên dưới sẽ bị mờ đi. Khi người sử dụng check vào thì sẽ hiện ra ô bên dưới cho phép đưa địa chỉ vào.
  • Khi người sử dụng nhấn chuột vào ô điền địa chỉ thì dòng chữ: Hãy điền địa chỉ giao hàng vào đây nếu khác trên sẽ tự động được xóa đi.
  • Kiểm tra thời gian hết hiệu lực (01/99)

- Sau khi các dữ liệu đã được điền đúng. Nếu người sử dụng nhấn vào nút Đồng ý thì mở một cửa sổ mới với các thông tin điền vào như Hình 2.

https://lh3.googleusercontent.com/-2gWq2NaOWrY/Va93Zqzt8WI/AAAAAAAAA0k/woFkkvVKUOI/s464-Ic42/hdj-practical-16-1.png

Hình 2

  • Nếu người sử dụng nhấn Cancel thì chuyển lại form mua hàng với yêu cầu focus vào ô Họ và tên đệm.
  • Nếu người sử dụng nhấn OK thì ô thông báo như hình 3 hiện ra.

https://lh3.googleusercontent.com/-rPAjjgzF450/Va93p-dOWvI/AAAAAAAAA0w/Ps8CdupJjrc/s345-Ic42/hdj-practical-16-2.png

Hình 3

» Tiếp: Practical 17
« Trước: Practical 15
Các khóa học qua video:
Python SQL Server PHP C# Lập trình C Java HTML5-CSS3-JavaScript
Học trên YouTube <76K/tháng. Đăng ký Hội viên
Viết nhanh hơn - Học tốt hơn
Giải phóng thời gian, khai phóng năng lực
Copied !!!