ການບັນທຶກການສົ່ງ HTML
- ຫນ້າໜ້າທຳນາຍ HTML ປະກອບຂອງຟັດ
- ຫນ້າໜ້າຫລັງ HTML ການຈັດການ Input
ວັນນີ້ກໍານົດ <input> ການບັນທຶກການສົ່ງ.
ການບັນທຶກການສົ່ງ: text
<input type="text"> ການສະແດງຄູ່ມູນຄວາມສະແດງຄູ່ມູນ textພາສາບົດສະຫຼຸບ:
ຕົວຢ່າງ
<form> ຊື່ຫນັງ:<br> <input type="text" name="firstname"> <br> ຊື່ສິບຕອນ:<br> <input type="text" name="lastname"> </form>
以上 HTML 代码在浏览器中看上去是这样的：
ການບັນທຶກການສົ່ງ: password
<input type="password"> ການສະໝັກຄວາມສະແດງຄູ່ມູນ password：
ຕົວຢ່າງ
<form> User name:<br> <input type="text" name="username"> <br> User password:<br> <input type="password" name="psw"> </form>
以上 HTML 代码在浏览器中看上去是这样的：
ຄວາມຄິດ:ຄວາມສະແດງຄູ່ມູນພາສາ password ແມ່ນຈະຖືກການກວດສອບ (ສະແດງຄືສິບລະຫວ່າງຫົວສາຍຫົວຫຼັງ).
ການບັນທຶກການສົ່ງ: submit
<input type="submit"> ການສະໝັກການສົ່ງຂໍ້ມູນຂໍ້ມູນບົດສະຫຼຸບຄວາມຂະໜາດການຂັບເຄື່ອງບົດສະຫຼຸບກຸຕິ
ຄວາມຂະໜາດການຂັບເຄື່ອງບົດສະຫຼຸບ (form-handler) ແມ່ນເປັນເວັບໄຊທີ່ບັນຈຸການຂັບເຄື່ອງຂໍ້ມູນບາງຄົນທີ່ຂຽນໃນສະໜາມທີ່ບັນຈຸການຂັບເຄື່ອງຂໍ້ມູນ。
在表单的 action 属性中规定表单处理程序（form-handler）：
ຕົວຢ່າງ
<form action="action_page.php"> ຊື່ຫນັງ:<br> <input type="text" name="firstname" value="Mickey"> <br> ຊື່ສິບຕອນ:<br> <input type="text" name="lastname" value="Mouse"> <br><br> <input type="submit" value="Submit"> </form>
以上 HTML 代码在浏览器中看上去是这样的：
如果您省略了提交按钮的 value 属性，那么该按钮将获得默认文本：
ຕົວຢ່າງ
<form action="action_page.php"> ຊື່ຫນັງ:<br> <input type="text" name="firstname" value="Mickey"> <br> ຊື່ສິບຕອນ:<br> <input type="text" name="lastname" value="Mouse"> <br><br> <input type="submit"> </form>
Input Type: radio
<input type="radio"> 定义单选按钮。
Radio buttons let a user select ONLY ONE of a limited number of choices:
ຕົວຢ່າງ
<form> <input type="radio" name="sex" value="male" checked>Male <br> <input type="radio" name="sex" value="female">Female </form>
以上 HTML 代码在浏览器中看上去是这样的：
Input Type: checkbox
<input type="checkbox"> 定义复选框。
ຄຳວິດີຈະການການຄົ້ນຫາຄຳວິດີຈະການທີ່ຈະຫຼຸດລົງຄຳວິດີຈະການເລືອກຢ່າງຫຼາຍຫຼືບໍ່ມີຄຳວິດີຈະການໃດໜຶ່ງ.
ຕົວຢ່າງ
<form> <input type="checkbox" name="vehicle" value="Bike">I have a bike <br> <input type="checkbox" name="vehicle" value="Car">I have a car </form>
以上 HTML 代码在浏览器中看上去是这样的：
Input Type: button
<input type="button"> ການສະໝັກຄະຕິ。
ຕົວຢ່າງ
<input type="button" onclick="alert('Hello World!')" value="Click Me!">
以上 HTML 代码在浏览器中看上去是这样的：
HTML5 输入类型
HTML5 增加了多个新的输入类型：
- color
- date
- datetime
- datetime-local
- month
- number
- range
- search
- tel
- time
- url
- week
ຄວາມຄິດ:ບາງສາຍອາກາດເກົ່າທີ່ບໍ່ສະໜັບສະໜູນປະເພດການເຂົ້າຂໍ້ມູນນີ້ຈະຖືກເບິ່ງຄືກັບປະເພດການເຂົ້າຂໍ້ມູນ text.
ປະເພດການເຂົ້າຂໍ້ມູນ: number
<input type="number"> ສຳລັບບັນດາບາງຄາງເຂົ້າຂໍ້ມູນທີ່ຄວນກວມມີຕົວເລກ.
ທ່ານສາມາດຄວບຄຸມຂອງຕົວເລກ.
ພາຍໃຕ້ການສະອານາຈາກການສະໜັບສະໜູນຂອງສາຍອາກາດ, ການຄວບຄຸມສາມາດນຳໃຊ້ໃນບາງບັນດາບາງຄາງເຂົ້າຂໍ້ມູນ.
ຕົວຢ່າງ
<form> ປະລິມານ (ລະຫວ່າງ 1 ແລະ 5): <input type="number" name="quantity" min="1" max="5"> </form>
ການຄວບຄຸມການເຂົ້າຂໍ້ມູນ
ບັນດາການຄວບຄຸມການເຂົ້າຂໍ້ມູນທີ່ໃຊ້ຫຼາຍ(ບາງຫນັງແມ່ນໄດ້ຖືກເພີ່ມໃຫ້ໃນ HTML5):
| ຜົນງານ: | ການອະທິບາຍ: |
|---|---|
| disabled | ກຳນົດບັນດາບາງຄາງເຂົ້າຂໍ້ມູນວ່າຄວນຖືກຫລຸດອອກ. |
| max | ກຳນົດຄວາມຜິດຈະການຂອງຄຳນວນຂອງບັນດາບາງຄາງເຂົ້າຂໍ້ມູນທີ່ຄວນກວມ. |
| maxlength | ກຳນົດຄວາມຜິດຈະການຂອງຈໍານວນຄວາມມາດຂອງບັນດາບາງຄາງເຂົ້າຂໍ້ມູນ. |
| min | ກຳນົດຄວາມຜິດຈະການຂອງຄຳນວນຂອງບັນດາບາງຄາງເຂົ້າຂໍ້ມູນທີ່ຄວນກວມ. |
| pattern | ກຳນົດຮູບແບບຂອງປະກາດການກວດສອບຄຳນວນຂໍ້ມູນ. |
| readonly | ກຳນົດບັນດາບາງຄາງເຂົ້າຂໍ້ມູນວ່າບໍ່ສາມາດດັດແປງ(ບໍ່ສາມາດດັດແປງ). |
| required | ກຳນົດບັນດາບາງຄາງເຂົ້າຂໍ້ມູນວ່າຕ້ອງການ(ຕ້ອງບັນທຶກ). |
| size | ກຳນົດຄວາມຜິດຈະການຂອງຄວາມຍາວຂອງບັນດາບາງຄາງເຂົ້າຂໍ້ມູນ(ຈໍານວນຄວາມມາດ). |
| step | ກຳນົດຄວາມຜິດຈະການຂອງຄຳນວນຂອງບັນດາບາງຄາງເຂົ້າຂໍ້ມູນ. |
| value | ກຳນົດຄວາມຜິດຈະການຂອງບັນດາບາງຄາງເຂົ້າຂໍ້ມູນທີ່ຄວນກວມ. |
ທ່ານຈະຮຽນຫຼາຍກວ່າກັບການຄວບຄຸມຂໍ້ມູນເຂົ້າບາງຄັ້ງໃນຄັ້ງຕໍ່ໄປ.
ຕົວຢ່າງ
<form> ປະລິມານ: <input type="number" name="points" min="0" max="100" step="10" value="30"> </form>
ປະເພດການເຂົ້າຂໍ້ມູນ: date
<input type="date"> ສຳລັບບັນດາບາງຄາງເຂົ້າຂໍ້ມູນທີ່ຄວນກວມມີວັນທີ.
ອີງຕາມການສະໜັບສະໜູນຂອງບູຣແອນເກີຣ, ການເລືອກວັນຈະປະກົດຂຶ້ນໃນບ່ອນສຳຫຼັບຄຳເຂົ້າ.
ຕົວຢ່າງ
<form> ວັນເກີດ: <input type="date" name="bday"> </form>
ທ່ານສາມາດສະເໜີການຄວບຄຸມການເຂົ້າຂໍ້ມູນບາງຄັ້ງ:
ຕົວຢ່າງ
<form> ບັນທຶກວັນທີໄລຍະກ່ອນ 1980-01-01: <input type="date" name="bday" max="1979-12-31"><br> ເຂົ້າມື້ຫຼັງຈາກ 2000-01-01: <input type="date" name="bday" min="2000-01-02"><br> </form>
ປະເພດການເຂົ້າ: color
<input type="color"> ມີຜົນງານສຳຫຼັບບ່ອນສຳຫ�ັບຄຳເຂົ້າທີ່ຄວນກວມມີສີ.
ອີງຕາມການສະໜັບສະໜູນຂອງບູຣແອນເກີຣ, ການເລືອກສີຈະປະກົດຂຶ້ນໃນບ່ອນສຳຫຼັບຄຳເຂົ້າ.
ຕົວຢ່າງ
<form> ເລືອກສີທີ່ມັກ: <input type="color" name="favcolor"> </form>
ປະເພດການເຂົ້າ: range
<input type="range"> ມີຜົນງານສຳຫຼັບບ່ອນສຳຫຼັບຄຳເຂົ້າທີ່ຄວນກວມມີຄຳຕາມຄືນຳນັກພິມ.
ອີງຕາມການສະໜັບສະໜູນຂອງບູຣແອນເກີຣ, ບ່ອນສຳຫຼັບຄຳເຂົ້າສາມາດສະແດງຄືກັບຄະຕິນກັບການຂັບຂວາງ.
ຕົວຢ່າງ
<form> <input type="range" name="points" min="0" max="10"> </form>
ທ່ານສາມາດນຳໃຊ້ປະສານອາສາສະໝັກນີ້ເພື່ອກຳນົດຂໍ້ຈຳກັດ: min, max, step, value.
ປະເພດການເຂົ້າ: month
<input type="month"> ອະນຸຍາດຜູ້ນຳໃຊ້ເລືອກເດືອນແລະປີ.
ອີງຕາມການສະໜັບສະໜູນຂອງບູຣແອນເກີຣ, ການເລືອກວັນຈະປະກົດຂຶ້ນໃນບ່ອນສຳຫຼັບຄຳເຂົ້າ.
ຕົວຢ່າງ
<form> ວັນເສັງ (ທີ່ເດືອນ ແລະ ປີ): <input type="month" name="bdaymonth"> </form>
ປະເພດການເຂົ້າ: week
<input type="week"> ອະນຸຍາດຜູ້ນຳໃຊ້ເລືອກຟອຍແລະປີ.
ອີງຕາມການສະໜັບສະໜູນຂອງບູຣແອນເກີຣ, ການເລືອກວັນຈະປະກົດຂຶ້ນໃນບ່ອນສຳຫຼັບຄຳເຂົ້າ.
ຕົວຢ່າງ
<form> ເລືອກຟອຍ: <input type="week" name="week_year"> </form>
ປະເພດການເຂົ້າ: time
<input type="time"> ອະນຸຍາດຜູ້ນຳໃຊ້ເລືອກເວລາ (ບໍ່ມີເຂດເວລາ).
ອີງຕາມການສະໜັບສະໜູນຂອງບູຣແອນເກີຣ, ການເລືອກເວລາຈະປະກົດຂຶ້ນໃນບ່ອນສຳຫຼັບຄຳເຂົ້າ.
ຕົວຢ່າງ
<form> ເລືອກເວລາ: <input type="time" name="usr_time"> </form>
ປະເພດການເຂົ້າ: datetime
<input type="datetime"> ອະນຸຍາດຜູ້ນຳໃຊ້ເລືອກວັນແລະຕອນ (ມີເວລາ).
ອີງຕາມການສະໜັບສະໜູນຂອງບູຣແອນເກີຣ, ການເລືອກວັນຈະປະກົດຂຶ້ນໃນບ່ອນສຳຫຼັບຄຳເຂົ້າ.
ຕົວຢ່າງ
<form> ວັນເສັງ (ທີ່ມື້ ແລະ ຕອນ): <input type="datetime" name="bdaytime"> </form>
ປະເພດການເຂົ້າ: datetime-local
<input type="datetime-local"> ອະນຸຍາດຜູ້ນຳໃຊ້ເລືອກວັນແລະຕອນ (ບໍ່ມີເຂດເວລາ).
ອີງຕາມການສະໜັບສະໜູນຂອງບູຣແອນເກີຣ, ການເລືອກວັນຈະປະກົດຂຶ້ນໃນບ່ອນສຳຫຼັບຄຳເຂົ້າ.
ຕົວຢ່າງ
<form> ວັນເສັງ (ທີ່ມື້ ແລະ ຕອນ): </form>
输入类型：email
用于应该包含电子邮件地址的输入字段。
根据浏览器支持，能够在被提交时自动对电子邮件地址进行验证。
某些智能手机会识别 email 类型，并在键盘增加 ".com" 以匹配电子邮件输入。
ຕົວຢ່າງ
<form> E-mail: </form>
输入类型：url
用于应该包含 URL 地址的输入字段。
根据浏览器支持，在提交时能够自动验证 url 字段。
某些智能手机识别 url 类型，并向键盘添加 ".com" 以匹配 url 输入。
ຕົວຢ່າງ
<form> ການເພີ່ມເວບໄຊເຮືອນຂອງທ່ານ: <input type="url" name="homepage"> </form>
- ຫນ້າໜ້າທຳນາຍ HTML ປະກອບຂອງຟັດ
- ຫນ້າໜ້າຫລັງ HTML ການຈັດການ Input
