重置按钮小tip—为何不能重置表单数据呢

时间:2021-06-12 02:28:15

刚开始学html的同志有时候可能会遇到一个问题,就是为什么在编辑页面里面的重置按钮总是不起作用呢不清空数据呢?接下来就说明一下原因。

Reset 对象

Reset 对象代表 HTML 表单中的一个重置按钮。

在 HTML 表单中 <input type="reset"> 标签每出现一次,一个 Reset 对象就会被创建。

当重置按钮被点击,包含它的表单中所有输入元素的值都重置为它们的默认值。默认值由 HTML value 属性或 JavaScript 的 defaultValue 属性指定。

重置按钮在重置表单之前触发 onclick 句柄,并且这个句柄可以通过返回 fasle 来取消。

参阅 Form.reset() 方法 和 Form.onreset 事件句柄。

您可以通过遍历表单的 elements[] 数组来访问某个重置按钮,或者通过使用document.getElementById()。

重点来了

就是上面说到的默认值,编辑页面顾名思义就是已经填写过数据的页面,里面已经有默认的之前填写的数据,也就是说里面的输入框里面有一个默认值但不是之前像添加页面一样的空数据,所以当你点击重置按钮时只会回到原来默认的你第一次填写的value值,并不会清空数据。

ps:一开始我也会遇到这个问题,无论如何都觉得不可能理解。希望能帮到正在学习遇到和我一样问题的同志。

重置按钮小tip—为何不能重置表单数据呢的更多相关文章

  1. 微信小程序 PHP后端form表单提交实例详解

    微信小程序php后端form表单 https://www.cnblogs.com/tdalcn/p/7092716.html 1.小程序相对于之前的WEB+PHP建站来说,个人理解为只是将web放到了 ...

  2. Servlet的5种方式实现表单提交(注册小功能),后台获取表单数据

    用servlet实现一个注册的小功能 ,后台获取数据. 注册页面: 注册页面代码 : <!DOCTYPE html> <html> <head> <meta ...

  3. easyui不提交window中的form表单数据

    <form id="ff" method="post">, <div id="win" class="easyu ...

  4. 如何发送HTML表单数据

    多数时候,HTML表单的目的只是为了把数据发给服务器,之后服务器再处理这些数据并发送响应给用户.虽然看起来挺简单的,但我们还是得注意一些事情以确保传送的数据不会破坏服务器.或者给你的用户制造麻烦. 数 ...

  5. JavaScript实现ajax发送表单数据

    知识点: 1.重置表单数据 2.获取表单数据(纯JavaScript) 3.设置表单数据(纯JavaScript) 4.ajax发送数据到客户端 (1)设置请求头,自己组合数据 (2)实例化表单对象, ...

  6. 使用jQuery实现跨域提交表单数据

    我们在WEB开发中有时会遇到这种情况,比如要从A网站收集用户信息,提交给B网站处理,这个时候就会涉及到跨域提交数据的问题.本文将给您介绍如何使用jQuery来实现异步跨域提交表单数据.   在jQue ...

  7. 【ASP&period;NET Web API教程】5&period;2 发送HTML表单数据:URL编码的表单数据

    原文:[ASP.NET Web API教程]5.2 发送HTML表单数据:URL编码的表单数据 注:本文是[ASP.NET Web API系列教程]的一部分,如果您是第一次看本系列教程,请先看前面的内 ...

  8. flask 处理表单数据

    处理表单数据 表单数据的处理涉及很多内容,从获取数据到保存数据大致有以下步骤: 1.  解析请求,获取表单数据 2.  对数据进行必要的转换,比如讲勾选框的值转换成python的布尔值 3.  验证数 ...

  9. Ajax在jQuery中的应用 (4)向jsp提交表单数据

    ajax技术带给我们的是良好的用户体验,同时,使用jquery可以简化开发,提高工作效率. 下面就介绍一下大致的开发步骤. 工具/原料 本文中使用的是 jquery-1.3.2.min.js 方法/步 ...

随机推荐

  1. cd命令

    [cd]           切换目录     cd===>change directory 命令功能 : 切换目录到dirname 命令实例: 实例1:切换到跟目录下 命令: cd / 输出: ...

  2. 学生信息管理系统(cocos2d引擎)——数据结构课程设计

    老师手把手教了两天半,看了一下模式,加了几个功能就大功告成了!!! 给我的感想就是全都是指针! 添加图片精灵: CCSprite*  spBG = CCSprite::create("&qu ...

  3. linux 学习 常用命令

     以下命令是本人的CentOS6.5系统 一.linux个目录的作用 #linux个目录的作用 /bin 所有用户都可使用的命令 /sbin 超级用户(root)可以使用的命令 /boot 系统目录建 ...

  4. POJ 2484

    A Funny Game Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 3861   Accepted: 2311 Desc ...

  5. 更改pandas dataframe 列的顺序

    摘自 * 这是我的df: Net Upper Lower Mid Zsore Answer option More than once a day 0% 0.22% -0.12 ...

  6. windows2012R2安装SQL2005详情!

    用友T3软件报错单据的时候提示1105数据库错误 原因分析:客户使用的是sql2005 express的数据库,账套的物理文件达到了4G. 只能重装SQL的版本,but.... 在window2012 ...

  7. day14 内置函数二

    lamda 语法: 函数名 = lambda 参数: 返回值注意: 1. 函数的参数可以有多个. 多个参数之间⽤逗号隔开 2. 匿名函数不管多复杂. 只能写⼀⾏, 且逻辑结束后直接返回数据 3. 返回 ...

  8. flask-session 在redis中存储session

    依赖: Flask Flask-Session redis import os from flask import Flask, session, request from flask_session ...

  9. 关于163发邮件报错535 Error:authentication failed解决方法

    关于发邮件报错535 Error:authentication failed解决方法 调用163邮箱服务器来发送邮件,我们需要开启POP3/SMTP服务,这时163邮件会让我们设置客户端授权码,这个授 ...

  10. vue手写的轮播图片,解决已经修改data中的值,页面标签已绑定,但页面没效果

    1.效果 2.index.html <!DOCTYPE html> <html lang="en"> <link> <meta chars ...