问题:为什么点击 button 会刷新页面 ?

原因:你代码的写法可能如下图,把 <button> 按钮 写在 <form> </form> 标签里边啦。

<button> 放在 form 里边, 除了 IE 中 默认 type = "button",  其他浏览器默认 type = "submit"  具有表单提交功能。

解决方案:

一 :修改 按钮的 书写方式 ,改为 <input type="button"> ;

二 :阻止默认事件, 在button的点击事件中加入“e.preventDefult()”   

$('btn').click(function(e){

         e.preventDefult();

});

点击 button 自动刷新页面的更多相关文章

  1. 点击button自动刷新页面的奇葩错误

    以前在写练习的时候遇到过这样一个问题,自己在html中写了一个button <button>test1</button> 在没有给其附上onclick事件时是点击是不会有任何反 ...

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

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

  3. HTML Button自动刷新页面的问题

    一.问题<button class="am-btn am-btn-default am-btn-xs am-text-secondary" data-id="99& ...

  4. layui点击按钮自动刷新页面问题

    问题 <button class="layui-btn layui-btn-primary" onclick="findData()">查询< ...

  5. js自动刷新页面代码

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

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

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

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

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

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

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

  9. gulp+browserSync自动刷新页面

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

随机推荐

  1. window 10电脑永不熄屏的方法

    你的电脑是不是人还没有离开一会儿,经常锁屏,输入密码??反复反复,特别的折磨人,别急,下面我教你,告别反复,从此我的电脑我做主. 第一步,打开设置,进入个性化界面,点击锁屏界面,往下滑 第二步,找到屏 ...

  2. 站在CSS3的肩上定义选择器

    按上下文选择元素 按祖先元素选择要格式化的元素 输入ancestor,这里的ancestor是希望格式化的元素的祖先元素的选择器. 输入一个空格(必不可少). 如果需要,对后续的每个祖先元素重复第(1 ...

  3. 有一分数序列:2/1, 3/2, 5/3, 8/5, 13/8, 21/13....求出这个数列的第M到N项之和(M>2,N>2,N>M)

    package bianchengti; /* * 有一分数序列:2/1, 3/2, 5/3, 8/5, 13/8, 21/13.... * 求出这个数列的第M到N项之和(M>2,N>2, ...

  4. ionic + asp.net core webapi + keycloak实现前后端用户认证和自动生成客户端代码

    概述 本文使用ionic/angular开发网页前台,asp.net core webapi开发restful service,使用keycloak保护前台页面和后台服务,并且利用open api自动 ...

  5. 1、JavaScript中的Cookie 用于存储 web 页面的用户信息。

    总结:每个浏览器都有一定数量限制的cookie.每个浏览器中,每一个cookie都有一个path路径,指向请求访问的网页. -------------------------------------- ...

  6. 【python爬虫】scrapy入门8:发送POST请求

    scrapy基础知识之发送POST请求与使用 FormRequest.from_response() 方法模拟登陆 https://blog.csdn.net/qq_33472765/article/ ...

  7. 实验二、OpenCV图像滤波

    一.题目描述 对下面的图片进行滤波和边缘提取操作,请详细地记录每一步操作的步骤. 滤波操作可以用来过滤噪声,常见噪声有椒盐噪声和高斯噪声,椒盐噪声可以理解为斑点,随机出现在图像中的黑点或白点:高斯噪声 ...

  8. OpenStack的Swift组件详解

    一:简介     一.背景 1. Swift 最初是由 Rackspace 公司开发的高可用分布式对象存储服务(Object  Storage Service),并于 2010 年贡献给 OpenSt ...

  9. 前端基础进阶(十一):详细图解jQuery对象,以及如何扩展jQuery插件

    早几年学习前端,大家都非常热衷于研究jQuery源码.我还记得当初从jQuery源码中学到一星半点应用技巧的时候常会有一种发自内心的惊叹,“原来JavaScript居然可以这样用!” 虽然随着前端的发 ...

  10. python之robotframework+pycharm测试框架

    一.robotframework简介 Robot Framework是一款python编写的功能自动化测试框架.具备良好的可扩展性,支持关键字驱动,可以同时测试多种类型的客户端或者接口,可以进行分布式 ...