js的form基础知识点
在HTML 中,表单是由<form>元素来表示的,而在JavaScript 中,表单对应的则是HTMLForm-
Element 类型。HTMLFormElement 继承了HTMLElement,因而与其他HTML 元素具有相同的默认属
性。不过,HTMLFormElement 也有它自己下列独有的属性和方法。
- acceptCharset:服务器能够处理的字符集;等价于HTML 中的accept-charset 特性。
- action:接受请求的URL;等价于HTML 中的action 特性。
- elements:表单中所有控件的集合(HTMLCollection)。
- enctype:请求的编码类型;等价于HTML 中的enctype 特性。
- length:表单中控件的数量。
- method:要发送的HTTP 请求类型,通常是"get"或"post";等价于HTML 的method 特性。
- name:表单的名称;等价于HTML 的name 特性。
- reset():将所有表单域重置为默认值。
- submit():提交表单。
- target:用于发送请求和接收响应的窗口名称;等价于HTML 的target 特性。
获取表单
//通过id方式
var form = document.getElementById("formID");
//通过document.forms可以获得页面所有的表单
var form1 = document.forms[1];
//获取表单的name来找到这个表单,不过这种方式容易出错,将来的浏览器可能不兼容
var form2 = document.forms['form2'];
提交表单
//js方式
var form = document.getElementById("formID");
//提交表单
form.submit();
点击按钮,或者回车就可以提交了
<!--表单方式-->
<input type="submit" value="submit button"/>
<!--按钮方式-->
<button type="submit">submit button</button>
<!--图像方式-->
<input type="image" src="data:image.png"/>
阻止表单提交
//阻止提交表单
EventUtil.addHandler('form',"submit",function(event){
//获得事件对象
event = EventUtil.getEvent(event);
//阻止默认事件
EventUtil.preventDefault(event);
})
获取表单字段
var form = document.getElementById("form1");
//获取表单中的第一个字段
var field = form.elements[0];
//获取name为用户名的字段
var field1 = form.elements['usename'];
//获取表单字段的个数
var formcount = form.elements.length;
表单字段的共有属性
- disabled:布尔值,表示当前字段是否被禁用。
- form:指向当前字段所属表单的指针;只读。
- name:当前字段的名称。
- readOnly:布尔值,表示当前字段是否只读。
- tabIndex:表示当前字段的切换(tab)序号。
- type:当前字段的类型,如"checkbox"、"radio",等等。
- value:当前字段将被提交给服务器的值。对文件字段来说,这个属性是只读的,包含着文件在计算机中的路径。
待续...
js的form基础知识点的更多相关文章
- 小程序基础知识点讲解-WXML + WXSS + JS,生命周期
小程序基础 小程序官方地址,小程序开发者工具,点击此处下载.在微信小程序中有一个配置文件project.config.json,此文件可以让开发者在不同设备中进行开发. 微信小程序共支持5种文件,wx ...
- js基础知识点收集
js基础知识点收集 js常用基本类型 function show(x) { console.log(typeof(x)); // undefined console.log(typeof(10)); ...
- fastclick 源码注解及一些基础知识点
在移动端,网页上的点击穿透问题导致了非常糟糕的用户体验.那么该如何解决这个问题呢? 问题产生的原因 移动端浏览器的点击事件存在300ms的延迟执行,这个延迟是由于移动端需要通过在这个时间段用户是否两次 ...
- CSS 基础知识点 样式 选择器 伪类
CSS 基础知识点汇集 版权声明:这篇博客是别人写的,大神博客地址 : https://www.cnblogs.com/Mtime/p/5184685.html 1.CSS 简介 CSS 指层叠样式表 ...
- .NET基础知识点
.NET基础知识点 l .Net平台 .Net FrameWork框架 l .Net FrameWork框架提供了一个稳定的运行环境,:来保障我们.Net平台正常的运转 l 两种交 ...
- JavaScript基础知识点
本书目录 第一章: JavaScript语言基础 第二章: JavaScript内置对象第三章: 窗口window对象第四章: 文档document对象第五章: 表单form对象第六章: ...
- TypeScript 基础知识点整理
一.TypeScript的特点 1.支持ES6规范 2.强大的IDE支持(集成开发环境) 允许为变量指定类型,减少你在开发阶段犯错误的几率. 语法提示,在IDE编写代码时,它会根据你所处的上下文把你能 ...
- 基础知识点 关于 prototype __proto__
基础知识点 关于 prototype __proto__ 供js新手参考 JavaScript 的一些基础知识点: 在 JavaScript 中,所有对象 o 都拥有一个隐藏的原型对象(在 Fire ...
- 实现同时提交多个form(基础方法) 收集
实现同时提交多个form(基础方法) 收集 分类: 1.2-JSP 1.3-J2EE 1.1J2se 1.0-Java相关2011-12-01 20:59 1644人阅读 评论(0) 收藏 举报 bu ...
随机推荐
- Java温故系列之web项目复习
如果从外面导入项目 操作方法为: File->Import -->General-->Existing Project into Workspace 搭建sqlserver数据库连接 ...
- Java中的内部类(回调)
一.内部类的主要作用如下: 1. 内部类提供了更好的封装,可以把内部类隐藏在外部类之内,不允许同一个包中的其他类访问该类 2. 内部类的方法可以直接访问外部类的所有数据,包括私有的数据 3. 内部类所 ...
- select问题总结
select 从后台取来的值如何放到select里面的文本框中? $(".type option").each(function(){ if($(this).val() == de ...
- 把解压缩版的tomcat6注册成服务并设置自启动
操作步骤: 1.在“开始 ”→“运行 ”中输入cmd 命令,进入MS-DOS界面 2.cd 到tomcat的bin目录下 C:/> cd tomcat/bin 3.运行命令servi ...
- 通过SQL Server 2008数据库复制实现数据库同步备份
SQL Server 2008数据库复制是通过发布/订阅的机制进行多台服务器之间的数据同步,我们把它用于数据库的同步备份.这里的同步备份指的是备份服务器与主服务器进行 实时数据同步,正常情况下只使用主 ...
- JS splice() 定义和用法
定义和用法 splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目. 注释:该方法会改变原始数组. 语法 arrayObject.splice(index,howmany,item1, ...
- Web API的Log问题
建立了一个Web API项目,在WebApiConfig.cs中已经启用了Tracing. config.EnableSystemDiagnosticsTracing(); 同时web.config中 ...
- IO调度算法
简介: 当向设备写入数据块或是从设备读出数据块时,请求都被安置在一个队列中等待完成. 每个块设备都有它自己的队列. I/O调度程序负责维护这些队列的顺序,以更有效地利用介质.I/O调度程序将无序的I/ ...
- Google V8编程详解(五)JS调用C++
http://blog.csdn.net/feiyinzilgd/article/details/8453230 最近由于忙着解决个人单身的问题,时隔这么久才更新第五章. 上一章主要讲了Google ...
- ReaderWriterLock的UpgradeToWriterLock方法的一种使用场景
ReaderWriterLock对比互斥锁(lock)的优势是,读锁和写锁的分离,读锁之间互不排斥. 当然,本文重点不是讲ReaderWriterLock本身,而是讲它的UpgradeToWriter ...