点击button自动刷新页面的奇葩错误
以前在写练习的时候遇到过这样一个问题,自己在html中写了一个button
<button>test1</button>
在没有给其附上onclick事件时是点击是不会有任何反应的
但是把这个button放入from表单时
<form action="testAction" method="psot">
<button>test1</button>
</form>
无论有没有给button附上事件,点击后页面都会刷新
查找了半天资料网上有说是不是事件写错了或者是js冲突啊之类的问题,在确认了自己的所有方法没有写错之后,按照那些教程改了之后依旧没有解决,那么出现这种错误就不是冲突的问题
后来将button的代码加了一个type属性之后,问题就解决了
<button type="button">test1</button>
到这个时候才发现自己犯了一个很弱智的问题,<button> 标签有一个默认的属性是type="submit" 等于说如果你不自己手动覆盖的话,每一个默认写的button都是起到submit的作用,自然页面就会刷新。当加上type="button" 后,button就变为了一个普通的按钮,需要加上onclick事件才会有相应的反应了。
虽然只是一个微不足道的小bug,但对html不熟的我来说确实是修改了很长一段时间,所以特此记录下来,以防以后遇到相同的坑
点击button自动刷新页面的奇葩错误的更多相关文章
- 点击 button 自动刷新页面
问题:为什么点击 button 会刷新页面 ? 原因:你代码的写法可能如下图,把 <button> 按钮 写在 <form> </form> 标签里边啦. < ...
- form表单中的button自动刷新页面问题
form表单中如果存在button的话,有可能会出现一个问题:点击button,触发了页面的自动刷新事件. 原因是因为<button>标签默认的类型是submit,即默认的button点击 ...
- HTML Button自动刷新页面的问题
一.问题<button class="am-btn am-btn-default am-btn-xs am-text-secondary" data-id="99& ...
- layui点击按钮自动刷新页面问题
问题 <button class="layui-btn layui-btn-primary" onclick="findData()">查询< ...
- js自动刷新页面代码
<script language="JavaScript">function myrefresh(){window.location.reload();}setTime ...
- 高并发分布式系统中生成全局唯一(订单号)Id js返回上一页并刷新、返回上一页、自动刷新页面 父页面操作嵌套iframe子页面的HTML标签元素 .net判断System.Data.DataRow中是否包含某列 .Net使用system.Security.Cryptography.RNGCryptoServiceProvider类与System.Random类生成随机数
高并发分布式系统中生成全局唯一(订单号)Id 1.GUID数据因毫无规律可言造成索引效率低下,影响了系统的性能,那么通过组合的方式,保留GUID的10个字节,用另6个字节表示GUID生成的时间(D ...
- javascript(js)自动刷新页面的实现方法总结
自动刷新页面的实现方法总结: 1) <meta http-equiv="refresh"content="10;url=跳转的页面"> 10表示间隔 ...
- 使用gulp插件来自动刷新页面。
http://itakeo.com/blog/2016/05/19/gulpreload/?none=123 使用gulp插件来自动刷新页面.再也不用修改一次,按一下F5了. 首选通过npm inst ...
- gulp+browserSync自动刷新页面
BrowserSync “Browsersync能让浏览器实时.快速响应您的文件更改(html.js.css.sass.less等)并自动刷新页面.更重要的是 Browsersync可以同时在PC.平 ...
随机推荐
- 【Node.js】一、搭建基于Express框架运行环境+更换HTML视图引擎
1)安装express generator生成器 这个express generator生成器类似于vue-cli脚手架工具,用来创建一个后端项目,首先我们要对生成器进行全局安装,在cmd中输入下 ...
- http无状态
说http无状态,客户端请求,建立一个链接,请求完毕既会关掉连接,避免占用通道,对处理业务逻辑没有记忆功能
- 第19章 定义资源 - Identity Server 4 中文文档(v1.0.0)
您通常在系统中定义的第一件事是您要保护的资源.这可能是您的用户的身份信息,如个人资料数据或电子邮件地址,或访问API. 注意 您可以使用C#对象模型定义资源 - 或从数据存储加载它们.IResourc ...
- Odd-e CSD Course Day 2
首先在第二天中其實談的更多的是在於 Test-Driven 的部分,而第一天談的偏向如何寫出一個好的 A-TDD 案例 但在第二天開始,就不太會照固定的 Topic 進行講述,而且讓團隊成員就像一個真 ...
- JS之This的用法
This的用法 This作为JavaScript中的关键字,在函数中具有四种用法. 一.直接在函数中使用,谁调用这个函数,this就指向谁 例如: var n = "指我"; fu ...
- 让priority_queue支持小根堆的几种方法
点击这里了解什么是priority_queue 前言 priority_queue默认是大根堆,也就是大的元素会放在前面 例如 #include<iostream> #include< ...
- asyncio异步IO——Streams详解
前言 本文翻译自python3.7官方文档--asyncio-stream,译者马鸣谦,邮箱 1612557569@qq.com.转载请注明出处. 数据流(Streams) 数据流(Streams)是 ...
- vue(1)——node.js安装使用,利用npm安装vue
node node简介 node.js也是用js开发的语言,而且是一门服务端语言,更有大神利用node写了一个操作系统出来——NodeOS node能干什么 自带下载工具: 对于我们开发前端项目,no ...
- Linux系统下virtuoso数据库安装与使用
最近在调研关联数据的一些东西,需要用到rdf数据库,所以接触了virtuoso数据库.安装的坑其实并不多,之前在windows 10上安过一次.这次在ubuntu 18.04上安装一下,其他的linu ...
- linux缺页异常处理--内核空间
缺页异常被触发通常有两种情况-- 程序设计的不当导致访问了非法的地址 访问的地址是合法的,但是该地址还未分配物理页框. 下面解释一下第二种情况,这是虚拟内存管理的一个特性.尽管每个进程独立拥有3GB的 ...