点击button会自动刷新页面

如题
因为button标签按钮会提交表单。
解决方法如下:
1、将<button></button>改为<input type="button"> 或者直接在<button>中添加属性 type="button".
2、在button的点击事件中加入“e.preventDefult()”
$('btn').click(function(e){
e.preventDefult();
});
加入type = "button"后解决问题。
扩展资料:
<button> 标签定义一个按钮。
在 button 元素内部,您可以放置内容,比如文本或图像。这是该元素与使用 input 元素创建的按钮之间的不同之处。
<button> 控件 与 <input type="button"> 相比,提供了更为强大的功能和更丰富的内容。<button> 与 </button> 标签之间的所有内容都是按钮的内容,其中包括任何可接受的正文内容,比如文本或多媒体内容。例如,我们可以在按钮中包括一个图像和相关的文本,用它们在按钮中创建一个吸引人的标记图像。
唯一禁止使用的元素是图像映射,因为它对鼠标和键盘敏感的动作会干扰表单按钮的行为。
请始终为按钮规定 type 属性。Internet Explorer 的默认类型是 "button",而其他浏览器中(包括 W3C 规范)的默认值是 "submit"。
点击button会自动刷新页面的更多相关文章
- 关于button标签会刷新页面的问题
当button标签在form表单里面时,这时点击button按钮会提交表单刷新页面. <form action=""> <button>点击</but ...
- form表单中的button自动刷新页面问题
form表单中如果存在button的话,有可能会出现一个问题:点击button,触发了页面的自动刷新事件. 原因是因为<button>标签默认的类型是submit,即默认的button点击 ...
- 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.平 ...
- ios 返回不会自动刷新页面问题
在实际开发过程中,移动端的兼容性问题有很大的坑,安卓可以了ios不行,ios可以了安卓又失效了这样,其中ios的回退操作就是不会自动刷新页面,很烦! 常见的history.back() history ...
- js返回上一页并刷新、返回上一页、自动刷新页面
一.返回上一页并刷新 <a href="javascript:" onclick="self.location=document.referrer;"&g ...
随机推荐
- x509证书相关内容
什么是证书 X.509证书,其核心是根据RFC 5280编码或数字签名的数字文档. 实际上,术语X.509证书通常指的是IETF的PKIX证书和X.509 v3证书标准的CRL 文件,即如RFC ...
- 【JavaScript】对JS的封装
以下方法封装了获取ID元素的JS代码,调用以下代码方法并传值,则可以直接获取id所指元素 function $id(x) { //此处x只是形参,代表传进来的:要获取元素的id字符串 return d ...
- CSS图形
1.正方形 最终效果: CSS代码如下: #square { width: 100px; height: 100px; background: red; } 2.长方形 最终效果: CS ...
- 信步漫谈之Quartz—分布式调度(整合spring早期版本【低于spring3.1】)
一.环境 使用的jar包:spring2.5.6.quartz1.8.6 二.注意点 因为spring内置的quartz版本变化,所以存在spring和quartz版本接口兼容情况,如下: 1)spr ...
- vue用hbuilderX打包app嵌入h5方式云打包和遇到的问题
vue用hbuilderX打包app嵌入h5方式云打包和遇到的问题 vue用hbuilderX打包app就可以了,不过有兼容性问题,转换rem的用不了,嵌入到app的webview里面变得很小了,另外 ...
- Delphi的TService 服务路径获取 Dll中获取文件路径
研究delphi服务的路径,试了好几个方法 ,都没取出来,最后发现,要采用取DLL路径的方法 //一.获取Dll自身路径 //1)方法一: Function GetDllPath(sDllName:s ...
- THINKPHP and or 模板语句书写
select * from xx where (a = 22 or b = 333) or (c=11 and d=22) $where_1['a'] = array('eq', '222'); $w ...
- 网页静态化技术--Freemarker入门
网页静态化技术:为什么要使用网页静态化技术 网页静态化解决方案在实际开发中运用比较多,例如新闻网站,门户网站中的新闻频道或者是文章类的频道. 对于电商网站的商品详细页来说,至少几百万个商品,每个商品又 ...
- composer安装doctrine/dbal
composer安装doctrine/dbal composer安装doctrine/dbal,安装不成功,使用的安装命令为官方提供命令“composer require doctrine/dbal” ...
- opencv学习之路(37)、运动物体检测(二)
一.运动物体轮廓椭圆拟合及中心 #include "opencv2/opencv.hpp" #include<iostream> using namespace std ...