如题

因为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. Mysql 聚合函数返回NULL

    [1]聚合函数返回NULL 当where条件不满足时,聚合函数sum().avg()的返回值为NULL. (1)源数据表 (2)如下SQL语句 SELECT sClass, COUNT(*) AS t ...

  2. python中sorted()和set()去重,排序

    前言 在看一个聊天机器人的神经网络模型训练前准备训练数据,需要对训练材料做处理(转化成张量)需要先提炼词干,然后对词干做去重和排序 words = sorted(list(set(words))) 对 ...

  3. maven打包并上传到nexus3私服

    之前搭了个maven私服,接下来则要充分利用这个私服的优势上传自己的jar包了. 我们先在nexus上创建一个用来上传jar包的角色,并通过此角色创建若干帐号用来给开发者上传包.如图是我自己的配置: ...

  4. 为什么越来越多的人偏爱go语言

    如果你是一个开发者或者程序员,你大概应该听过Go语言或者Golang语言.当然,如果没有听过也没关系,看到这篇文章的同学,就说明你对Golang是关注的,只需要这一点就够了.今天来聊聊关于Golang ...

  5. 什么是Referer?Referer的作用?空Referer是怎么回事?

    什么是Referer? Referer是 HTTP请求header 的一部分,当浏览器(或者模拟浏览器行为)向web 服务器发送请求的时候,头信息里有包含 Referer.比如我在www.sojson ...

  6. my work

    Dad, what's your first job? How did you achieved?

  7. Vue 组件&组件之间的通信 之 非父子关系组件之间的通信

    Vue中不同的组件,即使不存在父子关系也可以相互通信,我们称为非父子关系通信: 我们需要借助一个空Vue实例,在不同的组件中,使用相同的Vue实例来发送/监听事件,达到数据通信的目的: 实例: 初始加 ...

  8. 读Vue源码 (依赖收集与派发更新)

    vue的依赖收集是定义在defineReactive方法中,通过Object.defineProperty来设置getter,红字部分主要做依赖收集,先判断了Dep.target如果有的情况会执行红字 ...

  9. JS(JavaScript)的进一步了解2(更新中···)

    js数据类型 基本数据类型:string   undefined   null  boolean  number 引用数据类型  Object  array  function 二者的区别 基本数据类 ...

  10. memcached、cookie、session

    Memcached(一个高性能的分布式的内存对象缓存系统) 可用来分担数据库的压力.通过在内存里维护一个统一的巨大的hash表,memcached能存储各种各样的数据,包括图像.视频.文件.以及数据库 ...