จะสร้างช่องทำเครื่องหมายใน HTML ได้อย่างไร?



ขณะเรียกดูเว็บไซต์โปรดของคุณช่องทำเครื่องหมายจะปรากฏขึ้นเมื่อคุณต้องการเลือกตัวเลือกเดียว ที่นี่เราจะดูวิธีสร้างช่องทำเครื่องหมายใน HTML

ขณะเรียกดูเว็บไซต์โปรดของคุณช่องทำเครื่องหมายจะปรากฏขึ้นเมื่อคุณต้องการเลือกหนึ่งตัวเลือกจากตัวเลือกที่มีอยู่มากมาย ช่องทำเครื่องหมายเหล่านี้สร้างขึ้นใน ด้วยความช่วยเหลือของแท็กพิเศษ ในบทความนี้เราจะดูวิธีสร้างช่องทำเครื่องหมายใน HTML และการทำงานของช่องทำเครื่องหมายตามลำดับต่อไปนี้:





จะสร้างช่องทำเครื่องหมายใน HTML ได้อย่างไร?

ช่องทำเครื่องหมายเป็นองค์ประกอบแบบฟอร์มที่ช่วยให้คุณสามารถเลือกตัวเลือกต่างๆจากตัวเลือกต่างๆที่มีอยู่ ช่องทำเครื่องหมายถูกสร้างขึ้นด้วยแท็ก HTML มันสามารถซ้อนอยู่ภายในองค์ประกอบหรือสามารถยืนอยู่คนเดียว นอกจากนี้ยังสามารถเชื่อมโยงกับแบบฟอร์มด้วยความช่วยเหลือของ รูปแบบแอตทริบิวต์ ของแท็ก

นี่คือตัวอย่างพื้นฐานในการสร้างช่องทำเครื่องหมายง่ายๆ:



แดงเขียวน้ำเงิน

เอาท์พุต:

ช่องทำเครื่องหมาย - ช่องทำเครื่องหมายใน html - edureka

ลองพิจารณาอีกตัวอย่างหนึ่งและเพิ่มปุ่มส่งเพื่อให้ช่องทำเครื่องหมายมีประโยชน์ คุณยังสามารถวางช่องทำเครื่องหมายไว้ในองค์ประกอบที่ระบุหน้าเพื่อประมวลผลแบบฟอร์มได้ที่นี่



สีไหนที่คุณชอบ? แดงเขียวน้ำเงิน

ผลลัพธ์:

เอาท์พุต:

ช่องทำเครื่องหมายเทียบกับปุ่มวิทยุ

ปุ่มตัวเลือกอนุญาตให้ผู้ใช้เลือกตัวเลือกเดียวเท่านั้น ในขณะที่ช่องทำเครื่องหมายอนุญาตให้ผู้ใช้เลือกตัวเลือกจำนวนเท่าใดก็ได้ ลองดูตัวอย่างและดูว่าปุ่มตัวเลือกและช่องทำเครื่องหมายทำงานอย่างไร:

ความสัมพันธ์ระหว่าง java และ javascript
 

ช่องทำเครื่องหมาย

สีไหนที่คุณชอบ? แดงเขียวน้ำเงิน

ปุ่มวิทยุ

เลือกเพศของคุณ? ชายหญิงไม่ทราบ

ผลลัพธ์:

เอาท์พุต:

ในตัวอย่างข้างต้นคุณจะเห็นว่าคุณสามารถเลือกช่องทำเครื่องหมายได้มากเท่าที่คุณต้องการ ทำให้ช่องทำเครื่องหมายเหมาะสำหรับช่วงเวลาที่ผู้ใช้ควรสามารถเลือกได้หลายตัวเลือก แต่ถ้าคุณลองเลือกปุ่มตัวเลือกมากกว่าหนึ่งปุ่มการเลือกก่อนหน้านี้จะถูกยกเลิกการเลือก วิธีนี้ช่วยให้คุณบังคับให้ผู้ใช้เลือกเพียงตัวเลือกเดียว

การปิดใช้งานช่องทำเครื่องหมายใน HTML

คุณสามารถปิดใช้งานช่องทำเครื่องหมายใน โดยใช้แอตทริบิวต์ที่ปิดใช้งาน ซึ่งสามารถทำได้ร่วมกับสคริปต์เพื่อเปิดหรือปิดใช้งานช่องทำเครื่องหมายขึ้นอยู่กับว่าตรงตามเกณฑ์ที่กำหนดหรือไม่

มาดูตัวอย่างวิธีปิดการใช้งานช่องทำเครื่องหมาย:

แดงเขียวน้ำเงิน

เอาท์พุต:

jit ใน java คืออะไร

ในตัวอย่างข้างต้นเราได้ปิดการใช้งานสีแดง ดังนั้นคุณสามารถเลือกสีเขียวและสีน้ำเงินจากช่องทำเครื่องหมาย แต่ไม่ใช่สีแดง

ด้วยเหตุนี้เราจึงมาถึงตอนท้ายของบทความของเรา ฉันหวังว่าคุณจะเข้าใจวิธีการทำงานของช่องทำเครื่องหมายใน HTML และวิธีการใช้งานที่แตกต่างกัน

เมื่อคุณรู้เกี่ยวกับช่องทำเครื่องหมายใน HTML แล้วให้ตรวจสอบไฟล์ โดย Edureka การฝึกอบรมการรับรองการพัฒนาเว็บจะช่วยให้คุณเรียนรู้วิธีสร้างเว็บไซต์ที่น่าประทับใจโดยใช้ HTML5, CSS3, Twitter Bootstrap 3, jQuery และ Google API และปรับใช้กับ Amazon Simple Storage Service (S3)

มีคำถามสำหรับเรา? โปรดระบุไว้ในส่วนความคิดเห็นของ“ ช่องทำเครื่องหมายใน HTML” แล้วเราจะติดต่อกลับไป