HTML 基础控件介绍.docx

 HYPERLINK /polk6/archive/2013/05/22/3075699.html HTML 基础控件介绍 1.input标签 input 标签用于搜集用户信息。 根据不同的 type 属性值，输入字段拥有很多种形式。可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。type属性如下：type= text：文本区域　　　　readonly属性：是否只读。password：密码区域，输入的文本以*展示checkbox：复选框　　　　checked属性：是否选中；radio：单选框；　　　　name属性：指定多个单选框的在一个区域里进行单选操作reset：重置当前form表单里所有标签到初始化状态(如清除文本区域内容)sumit：提交当前form表单信息到指定页面button：普通按钮　　　　value属性：button按钮显示的文本file：文件选择标签hide：隐藏区域，可以把一些不展示给用户，而自己使用的信息存放于此image：图片区域　　　　src属性：指定图片存放的路径；　　　　title属性：鼠标移到图上显示的文本；　　　　alt：图片加载失败或关闭时，显示的文本； ? 2.select标签 ? select 元素可创建单选或多选菜单。类似于winform的combox或listbox 属性介绍：size：默认展示的下拉列表尺寸。默认的为combox样式；大于1时，就是listbox样式。multiple：多项选择,按住Ctrl+左键进行多选。 子项： optgroup:选择项的类别，不能被选中。　　　　label属性：类别展示的名称　　　　title属性：鼠标移到选择项上去，要展示的信息 option:可选的项目　　　　vlaue属性：选择项具体的名称　　　　title属性：鼠标移到选择项上去，要展示的信息 代码示例： h3select标签/h3 select id=province multiple=multiple size=6 optgroup label=直辖市 /optgroup option value=bj title=北京市 北京/option option value=sh上海/option optgroup label=省市 /optgroup option value=zj浙江/option option value=fj福建/option /select 效果图： ? 2.2 获取选中项的value?  HYPERLINK /polk6/archive/2013/05/22/3075699.html ? 1$(#province).val() 　　 3.textarea标签 ? textarea：多行文本区域可以通过 cols 和 rows 属性来设定 textarea 的尺寸属性：rows：表示显示的行数cols：表示显示的列数readonly：是否只读 ? ? 4.label标签 ? 相当于一个展示文本框。重要的属性： for ：关联对应的控件id；当点击此label标签时，绑定id的控件会获取焦点； table tr tdlabel for=username姓名：/label/td tdinput type=text id=username//td /tr tr tdlabel for=userpwd密码：/label/td tdinput type=password id=userpwd //td /tr /table ? 5.fieldset标签 ? 类似于winform中的groupBox控件。 子项： legend/legend：表示抬头的名称。 h3fieldset标签/h3 fieldset style=width:130px legend性别/legend input type=radio name=sex value=boy /男 input type=radio name=sex value=girl /女 /fieldset ? ? 6.ul、ol、li 列表标签 ? ul ：unordered list （无序列表）ol ：ordered list ?（有序列表））li ：list item （列表项目），基于上面2个列表子项目。 代码示例： ul type=circle liul1/li liul2/li liul3/li /ul ol type=1