ການນໍາໃຊ້ Tag Input ເພື່ອຍື່ນແບບຟອມ
ຮູບແບບ HTML ແມ່ນຫນຶ່ງໃນວິທີການພື້ນຖານທີ່ສຸດທີ່ຈະເພີ່ມການໂຕ້ຕອບກັບເວັບໄຊທ໌ຂອງທ່ານ. ທ່ານສາມາດຖາມຄໍາຖາມແລະຄໍາຕອບຈາກຜູ້ອ່ານຂອງທ່ານ, ໃຫ້ຂໍ້ມູນເພີ່ມເຕີມຈາກຖານຂໍ້ມູນ, ສ້າງເກມແລະອື່ນໆ. ມີຈໍານວນຂອງເອກະສານ HTML ທີ່ທ່ານສາມາດໃຊ້ເພື່ອສ້າງແບບຟອມຂອງທ່ານ. ແລະເມື່ອທ່ານສ້າງແບບຟອມຂອງທ່ານ, ມີວິທີທີ່ແຕກຕ່າງກັນຫລາຍທີ່ຈະສົ່ງຂໍ້ມູນໄປຍັງເຄື່ອງແມ່ຂ່າຍຫຼືພຽງແຕ່ເລີ່ມການດໍາເນີນການແບບຟອມທີ່ກໍາລັງເຮັດ.
ເຫຼົ່ານີ້ແມ່ນມີຫຼາຍວິທີທີ່ທ່ານສາມາດສົ່ງແບບຟອມຂອງທ່ານ:
-
- ນີ້ແມ່ນວິທີການທົ່ວໄປທີ່ສຸດຂອງການໄດ້ຮັບຂໍ້ມູນກັບເຄື່ອງແມ່ຂ່າຍ, ແຕ່ວ່າມັນກໍ່ສາມາດຊອກຫາງ່າຍດາຍຫຼາຍ.
-
- ການນໍາໃຊ້ຮູບພາບເຮັດໃຫ້ມັນງ່າຍດາຍທີ່ຈະເຮັດໃຫ້ປຸ່ມສົ່ງຂອງທ່ານເຫມາະສົມກັບແບບຂອງເວັບໄຊທ໌ຂອງທ່ານ. ແຕ່ບາງຄົນອາດຈະບໍ່ຍອມຮັບມັນເປັນປຸ່ມສົ່ງ.
-
- ປຸ່ມ INPUT tag ໃຫ້ຫຼາຍທາງເລືອກດຽວກັນກັບຮູບພາບ INPUT tag ແຕ່ເບິ່ງຄືກັບປະເພດສົ່ງແບບມາດຕະຖານ. ມັນຮຽກຮ້ອງໃຫ້ JavaScript ເຮັດວຽກ.
- <ປຸ່ມ>
- ປ້າຍ BUTTON ແມ່ນປະເພດທີ່ມີປະສິດທິພາບຫຼາຍກວ່າປຸ່ມ INPUT. ແທັກນີ້ຈໍາເປັນຕ້ອງໃຊ້ Javacript ເພື່ອເປີດໃຊ້.
-
- ອົງປະກອບຄໍາສັ່ງແມ່ນໃຫມ່ໃນ HTML5, ແລະມັນສະຫນອງວິທີການກະຕຸ້ນສະຄິບແລະແບບຟອມທີ່ມີການປະຕິບັດທີ່ກ່ຽວຂ້ອງ. ມັນຖືກເປີດໃຊ້ໂດຍ JavaScript.
INPUT Element
ອົງປະກອບ INPUT ແມ່ນວິທີທົ່ວໄປທີ່ສຸດທີ່ຈະສົ່ງແບບຟອມ, ທັງຫມົດທີ່ທ່ານເຮັດແມ່ນເລືອກປະເພດ (ປຸ່ມ, ຮູບພາບ, ຫຼືສົ່ງ) ແລະຖ້າຈໍາເປັນຕ້ອງເພີ່ມບາງສະຄິບທີ່ຈະສົ່ງໄປຫາແບບຟອມ.
ອົງປະກອບ ສາມາດຂຽນໄດ້ເຊັ່ນດຽວກັນ. ແຕ່ຖ້າທ່ານເຮັດ, ທ່ານຈະມີຜົນແຕກຕ່າງກັນໃນຕົວທ່ອງເວັບທີ່ແຕກຕ່າງກັນ. ຕົວທ່ອງເວັບສ່ວນໃຫຍ່ເຮັດໃຫ້ປຸ່ມທີ່ກ່າວວ່າ "ສົ່ງ" ແຕ່ Firefox ເຮັດປຸ່ມທີ່ກ່າວວ່າ "ສົ່ງຄໍາຖາມ". ເພື່ອປ່ຽນປຸ່ມທີ່ກ່າວວ່າທ່ານຄວນເພີ່ມຄຸນສົມບັດ:
value = "Submit Form">
ອົງປະກອບແມ່ນຂຽນເຊັ່ນນັ້ນ, ແຕ່ຖ້າທ່ານປິດຄຸນສົມບັດອື່ນໆທັງຫມົດ, ທັງຫມົດທີ່ຈະສະແດງຢູ່ໃນຕົວທ່ອງເວັບແມ່ນປຸ່ມສີຂີ້ເຖົ່າ. ເພື່ອເພີ່ມຂໍ້ຄວາມໃຫ້ກັບປຸ່ມ, ໃຫ້ໃຊ້ຄຸນສົມບັດຄຸນຄ່າ. ແຕ່ປຸ່ມນີ້ຈະບໍ່ສົ່ງແບບຟອມຖ້າທ່ານບໍ່ໃຊ້ JavaScript.
onclick = "submit ()">
ແມ່ນຄ້າຍຄືກັນກັບປະເພດປຸ່ມ, ເຊິ່ງຕ້ອງການສະຄິບທີ່ຈະສົ່ງແບບຟອມ. ເວັ້ນເສຍແຕ່ວ່າແທນທີ່ຈະເປັນຄ່າຂໍ້ຄວາມ, ທ່ານຈໍາເປັນຕ້ອງເພີ່ມ URL ແຫຼ່ງຮູບພາບ.
src = "submitgif">
The BUTTON Element
ອົງປະກອບປຸ່ມ BUTTON ຮຽກຮ້ອງໃຫ້ມີແທັບເປີດແລະແທັບປິດເມື່ອທ່ານໃຊ້ມັນ, ເນື້ອຫາໃດໆທີ່ທ່ານຕິດຢູ່ພາຍໃນແທັບຈະຢູ່ໃນປຸ່ມ. ຫຼັງຈາກນັ້ນ, ທ່ານກະຕຸ້ນປຸ່ມທີ່ມີ script ເປັນ.
Submit Form
ທ່ານສາມາດປະກອບຮູບພາບໃນປຸ່ມຂອງທ່ານຫຼືປະສົມຮູບພາບແລະຂໍ້ຄວາມເພື່ອສ້າງປຸ່ມທີ່ຫນ້າສົນໃຈຫຼາຍຂຶ້ນ.
Submit Form
The COMMAND Element
ອົງປະກອບຄໍາສັ່ງແມ່ນໃຫມ່ກັບ HTML5. ມັນບໍ່ຈໍາເປັນຕ້ອງໃຊ້ແບບ FORM, ແຕ່ມັນສາມາດເປັນປຸ່ມສົ່ງສໍາລັບແບບຟອມ. ອົງປະກອບນີ້ອະນຸຍາດໃຫ້ທ່ານສ້າງຫນ້າໂຕ້ຕອບຕ່າງໆໂດຍບໍ່ຈໍາເປັນຕ້ອງໃຊ້ຮູບແບບເວັ້ນເສຍແຕ່ວ່າທ່ານກໍ່ຕ້ອງການແບບຟອມ. ຖ້າທ່ານຕ້ອງການຄໍາສັ່ງໃຫ້ເວົ້າບາງສິ່ງບາງຢ່າງ, ທ່ານຂຽນຂໍ້ມູນໃນລັກສະນະຂອງເຄື່ອງຫມາຍ.
label = "Submit Form">
ຖ້າທ່ານຕ້ອງການຄໍາສັ່ງຂອງທ່ານໃຫ້ເປັນຕົວແທນໂດຍຮູບພາບ, ທ່ານໃຊ້ຄຸນລັກສະນະຂອງໄອຄອນ.
icon = "submitgif">
ບົດຄວາມນີ້ແມ່ນສ່ວນຫນຶ່ງຂອງ HTML Forms Tutorial. ອ່ານບົດຮຽນຢ່າງເຕັມທີ່ເພື່ອຮຽນຮູ້ວິທີໃຊ້ຮູບແບບ HTML.
ແບບຟອມ HTML ມີວິທີທີ່ແຕກຕ່າງກັນຫຼາຍເພື່ອສົ່ງ, ດັ່ງທີ່ທ່ານໄດ້ຮຽນຮູ້ໃນຫນ້າທີ່ຜ່ານມາ. ສອງຂອງວິທີການເຫຼົ່ານີ້ແມ່ນປ້າຍ INPUT ແລະແທັກ BUTTON. ມີເຫດຜົນທີ່ດີທີ່ຈະນໍາໃຊ້ທັງສອງອົງປະກອບເຫຼົ່ານີ້.
INPUT Element
ໂຄດຄໍາສັ່ງແມ່ນວິທີທີ່ງ່າຍທີ່ສຸດທີ່ຈະສົ່ງແບບຟອມ. ມັນຮຽກຮ້ອງໃຫ້ບໍ່ມີຫຍັງນອກເຫນືອຈາກແທັບຕົວມັນເອງ, ບໍ່ແມ່ນຄ່າ. ເມື່ອລູກຄ້າກົດປຸ່ມ, ມັນຈະສົ່ງໂດຍອັດຕະໂນມັດ. ທ່ານບໍ່ຈໍາເປັນຕ້ອງເພີ່ມສະຄິບໃດໆ, ຕົວທ່ອງເວັບຮູ້ວ່າຈະສົ່ງແບບຟອມໃນເວລາທີ່ສົ່ງແທັກ INPUT ຖືກຄລິກ.
ບັນຫາແມ່ນວ່າປຸ່ມນີ້ແມ່ນຫຼາຍທີ່ຫນ້າກຽດແລະທໍາມະດາ. ທ່ານບໍ່ສາມາດເພີ່ມຮູບພາບມັນໄດ້. ທ່ານສາມາດແບບມັນເຊັ່ນດຽວກັບອົງປະກອບອື່ນໆ, ແຕ່ມັນຍັງສາມາດມີຄວາມຮູ້ສຶກຄືກັບປຸ່ມທີ່ຫນ້າຜິດປົກກະຕິ.
ໃຊ້ວິທີ INPUT ໃນເວລາທີ່ຮູບແບບຂອງທ່ານຕ້ອງມີຄວາມເຂົ້າໃຈເຖິງແມ່ນວ່າໃນຕົວທ່ອງເວັບທີ່ມີການປິດ JavaScript.
The BUTTON Element
ອົງປະກອບ BUTTON ສະເຫນີທາງເລືອກຫຼາຍສໍາລັບການສົ່ງແບບຟອມ. ທ່ານສາມາດໃສ່ສິ່ງໃດນຶ່ງພາຍໃນອົງປະກອບ BUTTON ແລະປ່ຽນເປັນປຸ່ມສົ່ງ. ຄົນສ່ວນຫຼາຍມັກໃຊ້ຮູບພາບແລະຂໍ້ຄວາມ. ແຕ່ທ່ານສາມາດສ້າງ DIV ແລະເຮັດໃຫ້ສິ່ງທັງຫມົດທີ່ສົ່ງປຸ່ມຖ້າທ່ານຕ້ອງການ.
ບັນຫາທີ່ໃຫຍ່ທີ່ສຸດຕໍ່ອົງປະກອບ BUTTON ແມ່ນວ່າມັນບໍ່ໄດ້ສົ່ງແບບຟອມອັດຕະໂນມັດ. ນີ້ຫມາຍຄວາມວ່າມັນຈໍາເປັນຕ້ອງມີປະເພດຂອງສະຄິບບາງຢ່າງທີ່ຈະເຮັດໃຫ້ມັນເປັນໄປໄດ້. ແລະດັ່ງນັ້ນ, ມັນແມ່ນການເຂົ້າເຖິງຫນ້ອຍກ່ວາວິທີການ INPUT. ຜູ້ໃຊ້ທີ່ບໍ່ໄດ້ເປີດໃຊ້ JavaScript ຈະບໍ່ສາມາດສົ່ງແບບຟອມທີ່ມີອົງປະກອບ BUTTON ເທົ່ານັ້ນທີ່ຈະສົ່ງມັນໄດ້.
ໃຊ້ວິທີການ BUTTON ໃນຮູບແບບທີ່ບໍ່ສໍາຄັນ. ນອກຈາກນີ້, ນີ້ແມ່ນວິທີການທີ່ດີທີ່ຈະເພີ່ມທາງເລືອກຕື່ມອີກໃນຮູບແບບຫນຶ່ງ.
ບົດຄວາມນີ້ແມ່ນສ່ວນຫນຶ່ງຂອງ HTML Forms Tutorial . ອ່ານມັນເພື່ອຮຽນຮູ້ເພີ່ມເຕີມກ່ຽວກັບວິທີໃຊ້ຮູບແບບ HTML