By GokiSoft.com|
18:36 24/11/2021|
Học HTML5 - CSS3
[Video] Tìm hiểu Form - Khóa học lập trình HTML/CSS
#readme.txt
I) Tim hieu pattern trong Form Input
+0-9. => Những ký tự hay được dùng
[ky tu se chua]
[0-9]* : gom >= 0 ky tu (null, 0, 34, 3454, )
[0-9]+ : >= 1
[0-9]? : 0 hoac 1 ky tu
[0-9]{3} : gom 3 ky tu thoi
[0-9]{m,n}: so ky tu tu m toi n (m=3, n= 16)
[0-9]{m,} : >=m
[0-9]{,n}: <= n
[abc]{2,3} -> gom cac ky tu a,b,c: 2->3
[a-z]
[\-A-Z]
[^abc] : ko bao gom cac ky tu a,b,c
II) Javascript
- Kien thuc core can ban
- Khai bao bien
- Bieu thuc + toan tu
- Menh de dieu kien
- Vong lap (for, while, do..while)
- Function
- Mang: Array
- Doi tuong: Object -> Structure (C)
- Kien thuc rieng cua Javascript so vs ngon ngu khac (C)
- Xu ly su kien
- Tuong tac vs tags (html) <-> Javascript
- localStorage: Luu tru du lieu
- JSON
#test_js.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Javascript tutorial</title>
</head>
<body>
<h1 style="text-align: center;">Welcome to learn Javascript</h1>
<script type="text/javascript">
//Noi code javascript
document.write('Hello World!!!')
//Khai bao bien
</script>
</body>
</html>
#vidu.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Form Page</title>
</head>
<body>
<!-- method: POST/GET -> cach gui du lieu (PHP/Laravel) -->
<form method="post">
<label>Ho & Ten</label>
<input required title="Yeu cau nhap ten nguoi dung" type="text" name="fullname" id="fullname" placeholder="Nhap ho & ten" autofocus="true" minlength="5" maxlength="50">
<br/><br/>
<label>Tuoi</label>
<input required type="number" min="0" max="100" name="age" id="age" placeholder="Nhap tuoi">
<br/><br/>
<label>Email</label>
<input required type="email" name="email" id="email">
<br/><br/>
<label>Phone</label>
<input required type="tel" name="phone_number" id="phone_number" pattern="[+0-9. ]{9,16}">
<br/><br/>
<label>Birthday</label>
<input type="date" name="birthday" id="birthday">
<br/><br/>
<label>Color</label>
<input type="color" name="test_color" id="color_id">
<br/><br/>
<label>Gioi Tinh</label>
<select>
<option value="">-- Lua chon gioi tinh --</option>
<option value="Nam">Nam</option>
<option value="Nu">Nu</option>
</select>
<input type="text" name="country" list="country_list">
<datalist id="country_list">
<option value="Viet Nam 1" />
<option value="Viet Nam 2" />
<option value="Viet Nam 3" />
<option value="Viet Nam 4" />
<option value="Viet Nam 5" />
</datalist>
<br/><br/>
<label>Gioi Tinh</label>
<input type="radio" value="Nam" name="gender"> Nam
<input type="radio" value="Nu" name="gender"> Nu
<br/><br/>
<label>Gioi Tinh</label>
<input type="checkbox" value="Nam" name="gender"> Nam
<input type="checkbox" value="Nu" name="gender"> Nu
<br/><br/>
<!-- type: button, submit, reset -->
<input type="submit" value="Submit Data">
<!-- button: type -> rong -> default: submit -->
<button type="reset">Reset Data</button>
</form>
</body>
</html>
Tags:
Phản hồi từ học viên
5
(Dựa trên đánh giá ngày hôm nay)