CreateTime--2017年7月19日10:37:11
Author:Marydon

js重置form表单

需要使用的方法:reset()

示例:

  HTML部分

<form id="test">
<input id="test2" type="hidden" value="2"/>
<textarea>测试是否会重置文本域,默认带值的不会被清空</textarea>
<textarea id="test3"></textarea>
测试手工录入<input type="text" value=""/>
<input type="text" value="设置初始值" id="test4"/>
<input type="button" value="重置" onclick="testReset();"/>
<input type="button" value="赋值" onclick="assignment();"/>
<select>
<option value="">请选择</option>
<option value="" selected>测试是否会重置下拉框</option>
<option value="">下拉框选中选项会被还原</option>
</select>
<!-- 经测试该值不会被还原 -->
<input id="test5" type="hidden" value="测试隐藏域通过js改变后会不会还原"/>
</form>

  JAVASCRIPT部分

function testReset () {
document.getElementById("test").reset();
alert($('#test5').val());
}
function assignment () {
$('#test3').val('通过js赋值或手工录入的信息都会被清空!');
$('#test4').val('改变初始值');
$('#test5').val('5');
alert($('#test5').val());
}

经测试,总结:

  1.特别注意:reset()方法实现的效果是还原,而不是重置(清空);

    例:带默认值的form表单标签(如:textarea,文本框),经用户修改后,调用重置方法,会被还原成初始值(默认值);

      调用重置方法后,下拉框会选中初次加载页面时选中的选项。

  2.重置reset()对隐藏域无效,即不会对隐藏域进行还原处理,隐藏域通过js改变后不会被还原;

  3.准确地说,jQuery没有重置form表单的方法,$('#test')[0].reset(),这种重置form表单的方法还是通过js实现的,因为:$('#test')[0]会将jQuery元素转换成dom元素。

 

js重置form表单的更多相关文章

  1. js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题

    js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题 js模拟form表单提交数据源码: /** * js模拟form表单提交 * @param ...

  2. JS 提交form表单

    源码实例一:javascript 页面加裁时自动提交表单Form表单:<form method="post" id="myform" action=&qu ...

  3. js验证form表单示例

    js验证form表单示例 检测测试了js表单验证,无jQuery(简单的功能有时无需jQuery版本) js代码如下:   <script type="text/javascript& ...

  4. 第十七篇 JS验证form表单

    JS验证form表单   这节课做一个实际的,项目里会遇到的东西,例如登录页面,我们输入‘用户名’和‘密码’或者‘手机号’还有‘验证码’等等,它都会做一个前端验证,比如验证码,是6位有效数字组成,那么 ...

  5. js之form表单的获取

    js中获取form的方法: 1. 利用表单在文档中的索引或表单的name属性来引用表单 document.forms[i] //得到页面中的第i个表单 document.forms[formName] ...

  6. js阻止form表单重复提交

    防止表单重复提交的方法总体来说有两种,一种是在js中阻止重复提交:另一种是在后台利用token令牌实现,大致思路是生成一个随机码放到session和form表单的隐藏输入框中,提交表单时两者对比,表单 ...

  7. 参数传递的四种形式----- URL,超链接,js,form表单

    什么时候用GET,  查,删, 什么时候用POST,增,改  (特列:登陆用Post,因为不能让用户名和密码显示在URL上) 4种get传参方式 <html xmlns="http:/ ...

  8. 纯js将form表单的数据封装成json 以便于ajax发送

    使用方式: var json = form2Json("formId");//这里的参数是form表单的id值 form2json.js function form2Json(fo ...

  9. 使用js提交form表单的两种方法

    提交form表单的时候瑶族一些简单的验证,验证完后才能提交,避免无效提交. 1.当输入用户名和密码为空的时候,需要判断.这时候就用到了校验用户名和密码,这个需要在前端页面写:有两种方法,一种是用sub ...

随机推荐

  1. Linux命令之passwd、chpasswd

    (1).命令passed passwd [-k] [-l] [-u [-f]] [-d] [-e] [-n mindays] [-x maxdays] [-w warndays] [-i inacti ...

  2. Git Bash 将本地代码提交到Github

    前提:已拥有Token,并且把本地的Token配置到了自己的Github里面(没有Token的自行去百度如何配置Token) 测试一下自己的连接 ssh -T git@github.com 本地操作: ...

  3. Xamarin中Unsupported major.minor version 52.0问题解决

    Xamarin中Unsupported major.minor version 52.0问题解决 出现这种问题,是由于所使用的Java代码使用Java 8所才具有的特性.这个时候,需要将JDK升级到J ...

  4. 客户端 localStorage, sessionStorage, cookie 的区别

    SessionStorage, LocalStorage, Cookie这三者都可以被用来在浏览器端存储数据,而且都是字符串类型的键值对! 区别在于前两者属于WebStorage,创建它们的目的便是存 ...

  5. [HDU1532]Drainage Ditches

    最大流模板题 今天补最大流,先写道模板题,顺便写点对它的理解 最大流问题就是给一个幽香有向图,每一条边有容量,问若从$s$点放水,最多会有多少水流到$t$ 为了解决整个问题,第一步我们当然要找到一条路 ...

  6. trim()函数 mysql中的强大字符串过滤函数

    mysql中功能强大的trim()函数. 去除两边空格: mysql> select trim(' hello world '); +-----------------------+ | tri ...

  7. [转载]memcached 命令操作详解

    转载:http://www.cnblogs.com/azheng007/p/3159345.html 一.存储命令 存储命令的格式: <command name> <key> ...

  8. HDU 4632 Palindrome subsequence (2013多校4 1001 DP)

    Palindrome subsequence Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 131072/65535 K (Java/ ...

  9. HDU 3473 Minimum Sum(划分树)

    Minimum Sum Time Limit: 16000/8000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Tota ...

  10. 基于jquery,bootstrap数据验证插件bootstrapValidator

    bootstrap:能够增加兼容性的强大框架. 因为项目需要数据验证,看bootstrapValidator 还不错,就上手一直,完美兼容,话不多说. 需要引用css: bootstrap.min.c ...