HTML 18.3 表单元素input的输入属性type
来源:互联网 发布:淘宝代金券怎么使用 编辑:程序博客网 时间:2024/05/17 22:33
HTML 18.3 表单元素input的输入属性type
只有表单元素inpu和bottont才有输入属性。
一.文本:type=“text”
<form>
First name:<br />
<input type="text" name="firstname" /><br />
Last name:<br />
<input type="text" name="lastname" /><br />
</form>
结果:
注1:<input type="text" name="lastname" />结果生成一个框:
注2:文本字段的默认宽度是20个字符。
注3:表单本身并不可见。在浏览器中看起来是这样的:
First name:
Last name:
二.密码字段:text=“password”,定义密码字段
<form>
User name:<br>
<input type="text" name="username" />><br />
User password:<br>
<input type="password" name="psw" />
</form>
结果:
三.单选按钮:text=“radio”,单选按钮允许用户在有限数量的选项中选择其中之一。
<form>
<input type="radio" name="sex" value="male" checked />Male <br />
<input type="radio" name="sex" value="female" /> Female
</form>
结果:
注1:<input type="radio" name="sex" value="female" />结果生成一个框:
注2:表单本身并不可见。在浏览器中看起来是这样的:
Male
Female
注3:checked的作用,设置初始状态,默认此按钮已打钩。
例如1,无checked:
<form>
<input type="radio" name="sex" value="male" /> Male <br />
<input type="radio" name="sex" value="female" /> Female
</form>
结果:
例如2,多个checked:
<form>
<input type="radio" name="sex" value="male" checked /> Male <br />
<input type="radio" name="sex" value="female" checked /> Female
</form>
结果:最后的一个生效,应该只有一个checked
四.复选框checkbox
<form action="action_page.php">
<input type="checkbox" name="vehicle" value="Bike" />I have a bike <br />
<input type="checkbox" name="vehicle" value="Car" />I have a car <br /><br />
</form>
结果:
加上checked,结果如下
<form action="action_page.php">
<input type="checkbox" name="vehicle" value="Bike" checked/>I have a bike <br />
<input type="checkbox" name="vehicle" value="Car" checked/>I have a car <br /><br />
</form>
五.提交按钮:type=“submit”submit [səb'mɪt]提交
定义用于向表单处理程序(form-handler)提交表单的按钮。
表单处理程序通常是包含用来处理输入数据的脚本的服务器页面。
表单处理程序在表单form的 action 属性中指定。
<form action=”action_page.php”>
<input type=”submit”value=”Submit”/>
</form>
结果:
<form action=”action_page.php”>
<input type=”submit”value=”提交提交提交”/>
</form>
结果:
六.定义按钮 button
<form>
<input type="button" onclick="alert('Hello World!')" value="Click Me!" />
</form>
结果:
与用表单元素button( ['bʌtn]按钮,纽扣),定义可点击的按钮比较:
<form>
<button type="button" onclick="alert('Hello World!')">Click Me!</button>
</form>
结果:
注:就是程序的写法不同,效果是一样的。
七.HTML5输入类型
HTML5 增加了多个新的输入类型:
color
date
datetime
datetime-local
month
number
range
search
tel
time
url
week
注释:老式 web 浏览器不支持的输入类型,会被视为输入类型text。
- HTML 18.3 表单元素input的输入属性type
- HTML -- input 元素的type属性的秘密
- html表单input元素输入立即校验的方法
- html表单的type属性
- HTML的表单元素和input元素
- HTML input type=file文件选择表单元素 小结
- HTML input type=file文件选择表单元素二三事
- HTML <input> type 属性
- 了解HTML表单之input元素的23种type类型
- 了解HTML表单之input元素的23种type类型
- 修改input输入框的type属性
- 了解HTML表单之input元素的30个元素属性
- HTML <input> 标签的 type 属性
- HTML <input> 标签的 type 属性
- HTML <input> 标签的 type 属性
- HTML <input> 标签的 type 属性
- 关于表单元素input的placeholder属性
- input元素属性type类型
- C#中datagridview使用tooltip控件显示单元格内容与datagridview自带的tooltip显示单元格内容的方法
- CodeForces 606B Testing Robots【读题题QAQ】
- 安卓低功耗蓝牙开发
- Easy 191题 Number of 1 Bits
- This app has been built with an incorrect configuration. Please configure your build for VectorDrawa
- HTML 18.3 表单元素input的输入属性type
- masterJ2EE篇001——启动tomcat报错Server Tomcat v7.0 Server at localhost failed to start
- 高效MacBook工作环境配置
- Caffe代码解读(四):solver_param
- strStr
- last-position-of-target
- search-insert-position
- search-a-2d-matrix
- first-position-of-target