jQuery มือถือในรูปแบบการป้อนข้อมูล
jQuery มือถือกล่องใส่ข้อความ
ป้อนข้อมูลผ่าน HTML มาตรฐานการเข้ารหัสองค์ประกอบ jQuery มือถือจะเพิ่มสไตล์ของพวกเขาจะทำให้มันดูน่าสนใจมากขึ้นและง่ายต่อการใช้งานบนโทรศัพท์มือถือ นอกจากนี้คุณยังสามารถใช้ใหม่ HTML5 <input> ประเภท:
ตัวอย่าง
<div class="ui-field-contain">
<label for="fullname">全名:</label>
<input type="text" name="fullname" id="fullname">
<label for="bday">生日:</label>
<input type="date" name="bday" id="bday">
<label for="email">E-mail:</label>
<input type="email" name="email" id="email" placeholder="你的电子邮箱..">
</div>
</form>
ลอง»
เคล็ดลับ: ใช้ตัวยึดเพื่อระบุคำอธิบายสั้น ๆ ที่อธิบายถึงค่าที่คาดหวังของช่องใส่:
<input placeholder="sometext">
ฟิลด์ข้อความ
สำหรับหลายคู่สายป้อนข้อความอาจจะใช้ <textarea>
หมายเหตุ: เมื่อคุณพิมพ์ข้อความบางช่องข้อความจะถูกปรับขนาดโดยอัตโนมัติเพื่อให้พอดีกับแถวที่เพิ่มเข้ามาใหม่
ตัวอย่าง
<div class="ui-field-contain">
<label for="info">附加信息:</label>
<textarea name="addinfo" id="info"></textarea>
</div>
</form>
ลอง»
กล่องใส่ค้นหา
type = "ค้นหา" ประเภทของกล่องใส่เป็นของใหม่ใน HTML5 ซึ่งถูกกำหนดให้เป็นเขตการค้นหาใส่ข้อความ:
ตัวอย่าง
<div class="ui-field-contain">
<label for="search">搜索:</label>
<input type="search" name="search" id="search">
</div>
</form>
ลอง»
ปุ่ม
เมื่อผู้ใช้เลือกจำนวน จำกัด เลือกเพียงหนึ่งตัวเลือกเมื่อใช้ปุ่ม
เพื่อที่จะสร้างชุดของปุ่มเพิ่มเข้าและฉลากที่สอดคล้องกับประเภท = "วิทยุ" เป็น ปุ่มปิดล้อมภายใน <fieldset> องค์ประกอบ นอกจากนี้คุณยังสามารถเพิ่มชื่อ <ตำนาน> องค์ประกอบในการกำหนด <fieldset>
เคล็ดลับ: ใช้ข้อมูลบทบาท = "controlgroup" เพื่อใส่กัน:
ตัวอย่าง
<fieldset data-role="controlgroup">
<legend>Choose your gender:</legend>
<label for="male">Male</label>
<input type="radio" name="gender" id="male" value="male">
<label for="female">Female</label>
<input type="radio" name="gender" id="female" value="female">
</fieldset>
</form>
ลอง»
ช่องทำเครื่องหมาย
เมื่อผู้ใช้เลือกหนึ่งหรือมากกว่าหนึ่งตัวเลือกในจำนวนที่ จำกัด ของตัวเลือกกล่องใช้ตรวจสอบ:
ตัวอย่าง
<fieldset data-role="controlgroup">
<legend>Choose as many favorite colors as you'd like:</legend>
<label for="red">Red</label>
<input type="checkbox" name="favcolor" id="red" value="red">
<label for="green">Green</label>
<input type="checkbox" name="favcolor" id="green" value="green">
<label for="blue">Blue</label>
<input type="checkbox" name="favcolor" id="blue" value="blue">
</fieldset>
</form>
ลอง»
ตัวอย่างเพิ่มเติม
สำหรับการรวมกันของปุ่มวิทยุแนวนอนหรือตรวจสอบกล่องใช้ข้อมูลประเภท = "แนวนอน"
นอกจากนี้คุณยังสามารถใช้ข้อมูลภาชนะที่ล้อมรอบไปด้วย <fieldset>:
ตัวอย่าง
<fieldset data-role="controlgroup">
<legend>请选择您的性别:</legend>
</fieldset>
</div>
ลอง»
หากคุณต้องการให้ปุ่มของคุณในคุณลักษณะที่เลือกไว้ก่อนใช้ HTML <input> มีการตรวจสอบ:
คุณสามารถปรากฏในรูปแบบ:
ตัวอย่าง
<div ข้อมูลบทบาท = "ป๊อปอัพ" id = "myPopup" class = "UI-เนื้อหา">
<วิธีการแบบฟอร์ม = "โพสต์" การกระทำ = "demoform.php">
<div>
<h3> ข้อมูลเข้าสู่ระบบ </ h3>
<label สำหรับ = "usrnm" class = "UI ที่ซ่อนอยู่ที่สามารถเข้าถึง"> ชื่อผู้ใช้: </ label>
<ประเภทขาเข้า = "text" name = "ผู้ใช้" id = "usrnm" ยึด = "ชื่อผู้ใช้">
<label สำหรับ = "PSWD" class = "UI ที่ซ่อนอยู่ที่สามารถเข้าถึง"> รหัสผ่าน: </ label>
<input type = "รหัสผ่าน" name = "passw" id = "PSWD" ยึด = "รหัสผ่าน">
</ div>
</ form>
</ div>
ลอง»