Prototype使用Form操作表单
来源:互联网 发布:手机贴纸淘宝 编辑:程序博客网 时间:2024/05/01 00:03
1.前言
Form和Form.Element非常相似,区别只是Form.Element操作指定表单控件,而Formr操作指定表单,或该表单内的全部表单控件。Form里包含如下方法。
1) disable(form):禁用指定表单内的所有表单控件。
2) enable(form):启用指定表单内的所有表单控件。
3) focusFirstElements(form):将焦点移动到指定表单中第一个可视的、有效的表单控件。
4) findFirstElement(form):返回表单中第一个有效的表单控件。
5) getElements(form):返回表单内的所有表单控件。
6) getInputs(form[,typeName[,name]]):返回表单中所有的<input…/>元素,并可通过typeName和name属性对该元素进行过滤。
7) reset(form):重置表单。
8) request:该方法是发送异步请求的简单方法。
9) serialize(form):返回指定表单内的所有表单控件所转换的查询字符串。
2.例子
下面代码示范了Form里方法的用法和功能。
<!DOCTYPE html><html><head><meta name="author" content="OwenWilliam" /><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title> Form元素 </title></head><body><script src="../../prototype.js" type="text/javascript"></script><!-- 被操作的目标表单 --><form id="form1" name="form1" method="post"><!-- 定义四个单行文本框 --><input id="text1" name="text1" type="text" /><br /><input id="text2" name="text2" type="text" /><br /><input id="text3" name="text3" type="text" /><br /><input id="text4" name="text4" type="text" value="xxxxxxxxx"/><br /><select id="st1" name="st1" size="3" ><option value="java">Java</option><option value="javaee">Java EE</option><option value="ajax">Ajax</option></select><br /></form><!-- 下面按钮将所有表单控件的转换成查询字符串 --><input type="button" value="转换查询字符串" onclick="alert($('form1').serialize());"/><br /><!-- 下面按钮将返回表单的第一个有效表单控件 --><input type="button" value="返回第一个有效的表单控件" onclick="alert($('form1').findFirstElement());"/><br /><!-- 下面按钮返回所有表单控件 --><input type="button" value="返回表单的全部表单控件"onclick="alert($('form1').getElements());"/><br /><!-- 下面按钮返回所有input控件 --><input type="button" value="返回表单的全部input"onclick="alert($('form1').getInputs());"/><br /><!-- 下面按钮启用所有表单控件 --><input type="button" value="启用所有表单控件"onclick="$('form1').enable();"/><br /><!-- 下面按钮禁用所有表单控件 --><input type="button" value="禁用所有表单控件"onclick="$('form1').disable();"/><br /><!-- 下面按钮将焦点移动到第一个可视的表单控件 --><input type="button" value="将焦点移动到第一个可视的表单控件" onclick="$('form1').focusFirstElement();"/><br /><!-- 下面按钮将重设表单 --><input type="button" value="重设表单"onclick="$('form1').reset();"/><br /></body></html>
3.运行结果
0 0
- Prototype使用Form操作表单
- Prototype使用Form.Element操作表单控件
- jQuery操作form表单
- form表单操作
- 操作form表单
- 使用prototype.js提交form
- Django form表单使用
- Jquery操作select、form表单
- jQuery操作Form表单元素
- jQuery操作Form表单元素
- js form表单相关操作
- js form表单数据操作
- SpringMVC的form:form表单的使用
- 使用Validate验证Form表单
- form表单使用样例
- springmvc form表单标签使用
- 使用ajax提交form表单
- 使用Form表单上传文件
- iOS网络缓存扫盲篇--使用两行代码就能完成80%的缓存需求
- DOO-SABIN 细分正方体(1)利用邻接矩阵表示
- Linux — 操作系统课程设计笔记
- Dubbo源码分析(九):与spring融合
- 启动Mongo之由于目标计算机积极拒绝,无法连接--mongoDB连接错误解决办法
- Prototype使用Form操作表单
- L2范数归一化
- C#设置当前项目为启动项
- 深入解析 ObjC 中方法的结构
- 【C++】Digest of 《effective C++》--2
- 第11周项目2储存班长信息的学生类
- IP网络的基本概念
- 结构体sizeof()的原则
- 文件系统的设计与实现(操作系统课程设计)