1.Form对象type类型

本文介绍了HTML表单元素的种类及其JavaScript对象表示,并详细说明了如何通过JavaScript操作这些表单元素,包括命名表单和表单元素、表单元素的属性及事件处理等内容。

<input type="text"  name="username"/>

input 的type类型 text 文本域     password 密码框, hidden 隐藏框, submit 提交框 , radio单选框 ,checkbox复选框, reset重置框,  image图片按钮

1.Form对象
    JavaScript的Form对象代表了一个HTML表单
    Form对象的属性: 
       elements[]数组,包含表示各种表单输入元素的JavaScript对象。
       action /encoding / method /target 直接对应 HTML<form>的性质action / encoding / method/target
    Form对象的方法:
       onsubmit() 用来探测表彰的提交,在表彰提交之前调用的,返回false,就会取消表单的提交。
       onreset() 用来探测表间的重置,在重置表单时被调用,返回false,可以阻止重置表单元素。

2.定义表单元素

HTML表单元素      
对象 HTML标记 type属性 描述和事件
Button <input type="button">或
<button type="button">
"button" 按扭;onclick
Checkbox <input type="checkbox"> "checkbox" 不具有单选按钮行为的切换按扭;onclick
FileUpload <input type="file"> file 用于输入要上载到Web服务器的文件名的输入框;onchange
Hidden  <input type="hidden"> hidden 随着表单提交的数据,对用户不可见;没有事件处理程序
OPtion <option> Select对象中的一个项目 ;事件处理程序属于Select对象,而不属于单独的Option对象
Password <input type="password" >  "password" 输入口令的输入 框,输入的字符不可见;onclick
Radio <input type="radio">  "radio" 具有单选按扭行为的切换按扭;onclick
Reset <input type="reset">或
<button type="reset">
"reset" 重置表单的按扭;onclick
Select <select> "select-one" 列表或下拉式菜单,可选中其中一个项目 ;onchange
Select  <select multiple> "select-mutiple" 列表,可以选中其中多个项目;onchange
Submit <input type="submit">或
<button type="submit">
"submit" 提交表单的按扭;onclick
Text <input type="text">  "text" 单行的文本输入框;onchange
Textarea <textarea>  "textarea" 多行的文本输入框;onchange


3.脚本化表单元素

    3.1 命名表单和表单元素
    第个表单元素都有name性质,要将表单提交 给服务器端程序,必须在相应的HTML标记中设置这一性质。
  3.2 表单元素的属性
    type 一个只读字符串,标识表单元素的类型。
    form 对包含这个元素的Form对象的只读引用。
    name 由HTML的name性质指定的只读字符串。
    value 一个可读可写的字符串,指定 了表单元素包含或表示的值。
     3.3 表单元素的事件处理程序 
    onclick 当启用在元素上点击鼠标,对于Buttion元素和与之相关的表彰元素来说这个处理程序 格外有用。
    onchange 当用户改变了元素表示的值时触发;
    onfocus 在表单元素收到输入焦点时触发 
    onblur 在表彰失去输入焦点时触发
4.表单验证示例
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值