《构建跨平台APP：jQuery Mobile移动应用实战》连载七-手机调查问卷
【范例7-3 文本编辑框制作简单的调查问卷】
01
02
03
04
05
06
07
08
09
10
11
12
13
14
调查问卷
15
16
17
18 <!--placeholder属性的内容会在编辑框内以灰色显示-->
19
20 <!--当data-clear-btn的值为true时，当该编辑框被选中-->
21 <!--可以单击右侧的按钮将其中的内容清空-->
22
23
24
25
26
27
28 <!--使用label时要使用for属性指向其对应控件的id-->
29
30
31
32
33
34
35
运行结果如图7-4所示。
当在编辑框中输入内容时，页面会发生一定的变化，如页面上方输入姓名和电话的两个编辑框中的文字会自动消失，要求填写电话信息的编辑框右侧会出现一个“删除”的图标，单击该图标，编辑框中的内容会被自动删除。另外，页面下方两个编辑框的内容会随着其中内容的行数而自动增加高度。
在问卷中填入数据后的页面如图7-5所示。之所以会带来这些变化是由于，jQuery Mobile为文本编辑框设置了一些属性，如placeholder属性中的内容即是当编辑框未被使用时在其中显示的内容。而当用户在编辑框中输入数据之后，placeholder所标注的内容会自动消失。
图7-4 简单的手机调查问卷 图7-5 在问卷中填入内容
在本范例中新用到的控件textarea，可以认为是一种定义了多行文本的文本编辑控件，它可以根据其中的内容自动调整自身的高度，同时也可以通过拖拽的方式对其大小进行调整。
另外有读者也许会注意到在输入电话的编辑框中，笔者将空间的type属性设置为了tel，这样就会在用户输入其中内容时，自动将输入法切换到数字键盘，方便用户使用。
另外，jQueryMobile还提供了一些其他属性，表7-1将它们一一列举出来，供读者参考。
jQueryMobile可用度越来越高，入门门槛低，可以少写代码来生成移动设备友好的界面。《构建跨平台APP：jQuery Mobile移动应用实战》这本书采用实例驱动的方式介绍jQueryMobile下的APP开发，全书提供70余个实战案例教会读者进行移动开发，最后还通过6个小型项目来复习和巩固所学知识点。想和作者交流，加Q群：348632872，作者在这里等你偶来。
来自 “ ITPUB博客 ” ，链接：https://blog.itpub.net/9848525/viewspace-1245530/ ，如需转载，请注明出处，否则将追究法律责任。
