JavaScript表单编程
来源:互联网 发布:短信猫 java usb 编辑:程序博客网 时间:2024/05/29 19:58
获取表单元素
var frm = document.getElementById("form1");//dom
var frm = document.forms[0]; //bom
var frm = document.forms[“form1”];//对IE是通过name值获得,对firefox是通过ID获得
var frm=document.表单名
访问表单域(字段)
—var frm = document.getElementById("form1");//dom
var field1 = frm.elements[0]; //第一个表单域,可用于遍历表单域
var field1 = frm.elements["name"];//得到名为name的表单域
var field1 = frm.name;//直接用名称得到表单域
var field1 = frm[“my name”];//得到name值有空格的表单域
var field1 = frm[0];//得到第几个表单元素
表单提交
<input type="submit" value="submit"> //提交按钮
<input type="image" src="submit.gif">//提交图片
doucment.forms["form1"].submit(); //使用js提交
提交表单时,会触发表单的submit事件,在onsubmit中返回false可以阻止表单提交。
使用submit()方法提交表单,不会触发submit事件。
表单重置
<input type="reset" value="reset"> //重置按钮
表单重置时,会触发表单的reset事件,在onreset中返回false可以阻止表单重置。
使用reset()方法提交表单,但仍会触发reset事件。
非隐藏表单字段的共有属性和方法
disabled:是否可用,当设置为不可用时,表单的值不会随表单提交
readOnly:只读。当设置之后,表单的内容不可改变,表单的值会随表单提交。只能用于文本框
form:得到表单
blur():使表单域失去焦点。
focus():使表单得到焦点。
blur事件:失去焦点时触发,并调用onblur()函数。
focus事件:得到焦点时触发,并调用onfocus()函数。
单行文本框text和多行文本框textarea
value属性得到或设置文本内容。
value.length可以得到文本长度。
选择文本框
select():选择文本内容。
文本框事件
blur,focus事件
change事件:用户改变文本框的值,并失去焦点后触发。注意和blur事件的区别
select事件:文本被选中,或select()被调用时触发。
实现自动选择文本
onfocus = "this.select();"
对列表框和组合框进行脚本编写
访问选项
listbox.options[0].firstChild.nodeValue;//取得选项文本
listbox.options[0].getAttribute("value");//取得选项值
listbox.options[0].text;//获得文本
listbox.options[0].value;//获得值
listbox.options.length;//获取选项数量
listbox.selected; //选项是否被选中
listbox. selectedIndex;
获得选择的序号,未选返回-1
multiple=multiple设为多选时,获得第1个。
添加选项
使用DOM添加节点。
删除选项
[BOM]listbox.options[1]=null;
[DOM]listbox.remove(0);
在不同的列表框中移动选项
DOM操作节点完成
重新排序选项
使用insertBefore(op1,op2)
checked属性:是否被选中
defaultChecked属性:默认是否被选中
click():模仿点击,会触发click事件,改变选择状态。
对于复选框,可以进行进行遍历操作。
表单验证
一个常用的功能,能有效降低服务器负担。
捕获错误的时机
错误发生前
keyPress事件
错误发生时
change事件
错误发生后
submit事件
表单验证最佳实践
提示应对用户有帮助
不要用alert()
长度验证时使用maxLength比用js验证更好。
一次显示所有错误
早点捕获错误
如果拿不准较验规则,就不要太严格。
- JavaScript编程:JavaScript表单编程
- JavaScript表单编程
- JavaScript表单编程
- JavaScript表单编程
- javascript基础编程应用表单验证
- 网页编程--JavaScript之表单校验
- javascript 表单
- javascript表单
- JavaScript----表单
- 【javascript】表单
- Javascript表单
- javascript表单
- JavaScript 表单
- Javascript-网页编程-DHTML-表单验证技术(正则表达式)
- 表单编程
- javascript 表单和表单元素
- JavaScript 表单及表单验证
- javascript表单事件汇总
- poj 3279 Fliptile
- 最长公共子序列及最长递增子序列NlogN算法及路径记录
- android WIFI 信号强度检测
- 流总结1
- 商业级开发框架(MVP+RxJava+Retrofit+GreenDAO)详解
- JavaScript表单编程
- HTTP错误代码描述
- 第十章:Approximate Inference exercise 1-10
- Codefroces 429 B. Working out
- 动态规划之背包问题
- 微机原理--第三章(6)移位指令
- 第十章:Approximate Inference exercise 11-17
- malloc与new的区别
- PHP面向对象_模拟一般面向对象语言中的方法重载(overload)