CuDemVN.Wap.Sh

- GetSmile.Mobie.In - Diễn đàn chia sẻ Cú đêm Việt Nam
- AiChat.Wap.Sh - Diễn đàn Xtgem Việt Nam
- HamTruyen.Xtgem.Com - Blog Ham Truyện nơi hội tụ của những tín đồ mê truyện chữ
* Trang chủ >> WapMaster
Tìm Kiếm Thảo Luận
↓↓

[HTML5] Kiểm tra form với regular expression

Admin* RoSino18k *
* 27-09-2015
Có nhiều bài viết đã đề cập và giới thiệu xem HTML5 là gì và như thế nào, các chức năng mới ra sao...

Mình là một người làm về Javascript. Do đó các mối quan tâm được chú trọng hơn về mặt Javascript. Và thật bất ngờ trong HTML5 đã làm một việc rất tiện cho chúng ta kiểm tra các dữ liệu.

Khi làm việc với HTML, thường chúng ta rất hay gặp các form và trong HTML5 có nhiều thuộc tính mới cho các tag của form. Điểm quan trọng nhất đó là chúng ta có thể kiểm soát được form trực tiếp trong HTML mà không cần thông qua Javascript. Có nghĩa là chúng ta có thể làm các việc như kiểm tra dữ liệu từ phía HTML (Và nếu trình duyệt đó không hỗ trợ Javascript hay bị tắt đi thì may thay chúng ta sẽ không bị ảnh hưởng). Đây chỉ là một lợi ích mà điều này mang lại (Nhưng dù sao mình vẫn thích làm các việc này từ phía Javascript, HTML chỉ để làm content struct thôi).

Thay đổi lớn nhất mình muốn nói trong bài này đó là các tag trong HTML5 sẽ có thêm thuộc tính pattern để chúng ta có thể kiểm tra dữ liệu. Chúng ta có thể sử dụng thuộc tính này và nhập vào một mẫu regular expression để kiểm tra dữ liệu mà người dùng đã nhập vào có giống với mẫu mà chúng ta đưa ra hay không.

Đây là ví dụ một cách validation bằng javascript:
<input type="text" name="part" onblur="if (!/^(?:[0-9][A-Z]{3})$/.this.value) alert(this.title+'\nYou cannot complete this form until the field is correct.');" title="A part number is a digit followed by three uppercase letters.">

Còn đây là trong HTML5:
<input type="text" name="part" pattern="[0-9][A-Z]{3}" title="A part number is a digit followed by three uppercase letters." />


Nguồn: *http://www.sanglt.com/Regular-Expression-trong-HTML5
↑↑ Lượt xem: 226
score
Đánh giá: 4.5/ 5, 226 bình chọn
- Chia sẻ:G  T
BBCode:

Link:
+ Còn “nhiều” Lắm!
+

Share code Diễn đàn trên Xtgem Full chức năng cực chất GetSmile.Mobie.In bởi Cú Đêm Việt Nam

+

Share code PHP hiển thị thông tin khách đang online trên Site

+

Sử dụng HTML và CSS tạo hiệu ứng hiển thị mô tả khi di chuột vào hình ảnh

+

Ajax là gì? Hướng dẫn code cơ bản khi xử lý dữ liệu với jQuery Ajax

+

Share full code PHP bộ tool cài đặt và quản lý Filelist KhoTruyen365 Xtgem

Trang chủ Cú Đêm Việt Nam Trang Chủ[1-1-226]

Polly po-cket