如题

因为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会自动刷新页面的更多相关文章

  1. 关于button标签会刷新页面的问题

    当button标签在form表单里面时,这时点击button按钮会提交表单刷新页面. <form action=""> <button>点击</but ...

  2. form表单中的button自动刷新页面问题

    form表单中如果存在button的话,有可能会出现一个问题:点击button,触发了页面的自动刷新事件. 原因是因为<button>标签默认的类型是submit,即默认的button点击 ...

  3. js自动刷新页面代码

    <script language="JavaScript">function myrefresh(){window.location.reload();}setTime ...

  4. 高并发分布式系统中生成全局唯一(订单号)Id js返回上一页并刷新、返回上一页、自动刷新页面 父页面操作嵌套iframe子页面的HTML标签元素 .net判断System.Data.DataRow中是否包含某列 .Net使用system.Security.Cryptography.RNGCryptoServiceProvider类与System.Random类生成随机数

    高并发分布式系统中生成全局唯一(订单号)Id   1.GUID数据因毫无规律可言造成索引效率低下,影响了系统的性能,那么通过组合的方式,保留GUID的10个字节,用另6个字节表示GUID生成的时间(D ...

  5. javascript(js)自动刷新页面的实现方法总结

    自动刷新页面的实现方法总结: 1) <meta http-equiv="refresh"content="10;url=跳转的页面"> 10表示间隔 ...

  6. 使用gulp插件来自动刷新页面。

    http://itakeo.com/blog/2016/05/19/gulpreload/?none=123 使用gulp插件来自动刷新页面.再也不用修改一次,按一下F5了. 首选通过npm inst ...

  7. gulp+browserSync自动刷新页面

    BrowserSync “Browsersync能让浏览器实时.快速响应您的文件更改(html.js.css.sass.less等)并自动刷新页面.更重要的是 Browsersync可以同时在PC.平 ...

  8. ios 返回不会自动刷新页面问题

    在实际开发过程中,移动端的兼容性问题有很大的坑,安卓可以了ios不行,ios可以了安卓又失效了这样,其中ios的回退操作就是不会自动刷新页面,很烦! 常见的history.back() history ...

  9. js返回上一页并刷新、返回上一页、自动刷新页面

    一.返回上一页并刷新 <a href="javascript:" onclick="self.location=document.referrer;"&g ...

随机推荐

  1. VMware复制CentOS7,网络配置问题处理

    问题: vm安装CentOS7,静态IP配置完毕后,关闭虚机1,克隆虚拟机为2.克隆出来的虚拟机使用ip addr命令,发现网卡但和之前名称完全不一样变成ens33,也没有ip地址,但/etc/sys ...

  2. BOM定时器,onresize

    定时器 <body> <button onclick="stop()">吃药</button> <button onclick=" ...

  3. shell里连接数据库,将结果输出到变量

    result=$(sqlplus -s 'ccc/ccc@21.96.34.34:1521'<<EOF ..... EOF )

  4. flask 电子邮件进阶实践-用模板发送163邮件

    电子邮件进阶实践 下面来学习构建邮件的HTML正文,并使用模板组织内容. 一封电子邮件的正文可以是纯文本(text/plain),也可以是HTML格式的文本(text/html).处于全面的考虑,一封 ...

  5. python小知识点随笔

    可能会有不局限于Python语言的内容,文中“>>>”表示结果,而不是命令行交互的提示符 1.关于字符串编码 ASCII编码 占用一个字节 二进制11111111=十进制255 所以 ...

  6. 【最新】Xmanager Power Suite 6.0 Build 0010

    永久最新版地址:https://www.netsarang.com/download/down_live.html 弹出来的下载地址,在.exe前面加r即可. 截至2018年11月14日发布的最新版本 ...

  7. java个内部类的总结

    内部类的概念 成员内部类 访问成员内部类格式: 案例 局部内部类 案例 静态内部类 访问格式: 案例 匿名内部类 格式: 案例 内部类的概念 将类定义在类的内部,那么该类就成为内部类 注意: 内部类是 ...

  8. create-react-app不暴露配置设置proxy代理

    此方法可以在不暴露配置的情况下直接设置代理,非常便捷 在package.json里添加 "proxy":"http://institute.dljy.lzdev" ...

  9. Spring history、design philosophy (Spring的历史及设计理念)

    一,Spring的发展史 1,Spring1.x 时代 在Spring1.x时代,都是通过xml文件配置bean,随着项目的不断扩大,需要将xml配置分放到不同的配置文件中,需要频繁的在java类和x ...

  10. oracle 结果集合并

    SELECT case ' then ()) FROM T_UEP_DB_UNION A ' ' start with A.UNION_CODE = U.UNION_CODE CONNECT BY P ...