<form action="#" method="post">
<input type="text" name="username" class="username" placeholder="请输入您的用户名!">
<input type="password" name="password" class="password" placeholder="请输入您的用户密码!">
<input type="Captcha" class="Captcha" name="Captcha" placeholder="请输入验证码!">
<button type="submit" class="submit_button">登录</button>
<div class="error"><span>+</span></div>
</form>

每次我们点击button,button都会自动跳转刷新。如何阻止它呢?很简单!

将button代码改成

<button type="submit" class="submit_button" onClick=“submitAction();return false;”>登录</button>

这样它就不会执行默认表单提交了!

如果不喜欢这样处理,也可以在js按钮触动代码末尾中添加return false;同样可以达到相同效果!

如何阻止form表单中的button按钮提交的更多相关文章

  1. form表单中的button按钮

    如果在form表单中 , 存在button元素,button元素就充当了submit的角色

  2. form表单中新增button按钮,点击按钮表单会进行提交

    原生button控件,在非ie浏览器下,如果不指定type,默认为submit类型.如果不想自动提交表单,指定type=“button”

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

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

  4. 问题解决:form表单的button按钮问题

    最近写了一个KendoUI 的kendowindow组件,组件里包含了一个form表单,表单里有一个button,不是提交保存的按钮,而是链接到另一个kendowindow的按钮,跟请求提交毫无关系, ...

  5. 在一个form表单中根据不同按钮实现多个action事件

    <form id="writeForm" method="post"> <div class="write-btn-tj" ...

  6. Form表单中不同的按钮进行不同的跳转

    本文参考:http://my.oschina.net/sallency/blog/300568 在开发工作共我们往往会遇到一个表单需要包含多个action不同的提交动作,这时候就不能在使用submit ...

  7. 阻止form表单中的input按下回车时提交表单

    给form加属性:onsubmit="return false;"

  8. 关于form表单中button按钮自动提交问题

    坑:点击确认按钮,form表单提交2次,发送后台2次请求 //错误代码: <Button id="btnSubmit" name="btnSubmit" ...

  9. form表单中button按钮返回上一页解决办法

    解决Form中button按钮不好用的问题解决办法. 方法一: 1.在Form表单标签中国增加一个属性,如下图,红框处 2.返回按钮样式 3.onclick方法需要跳转的页面,遮挡处为需要返回的页面 ...

随机推荐

  1. 查看/设置MySQL数据库的事务隔离级别

    查看InnoDB存储引擎 系统级的隔离级别 和 会话级的隔离级别: mysql> select @@global.tx_isolation,@@tx_isolation; +---------- ...

  2. javascript判断浏览器核心

    20 21 22 23 24 /** * 判断浏览器核心 * @return IE6.0/IE7.0/IE8.0/FireFox/Opera/other * @author ypz */ functi ...

  3. FFmpeg X264 H264编码指南[译]

    本文目标:如何创建一个高质量的H.264视频 x264 是一个 H.264 编码器. 通常有2种码率控制(rate control)模式:Constant Rate Factor (CRF) or T ...

  4. HTTP Status Codes 状态码

    Network Connect Timeout Error

  5. 01 linux上安装 nginx

    一:linux上安装 nginx 下载nginx:wget http://nginx.org/download/nginx-1.6.2.tar.gz 解压:tar zxvf nginx-1.6.2.t ...

  6. FastDFS分布文件系统

    FastDFS是为互联网应用量身定做的一套分布式文件存储系统,非常适合用来存储用户图片.视频.文档等文件.对于互联网应用,和其他分布式文件系统相比,优势非常明显.具体情况大家可以看相关的介绍文档,包括 ...

  7. 安装Struts2 类库

    现在,如果一切正常,那么你可以继续设置您的Struts 2框架.以下是简单的步骤,下载并安装在机器上Struts2. 请选择是否要安装Hibernate在Windows或Unix,然后继续进行下一个步 ...

  8. json性能测试

    http://www.open-open.com/lib/view/open1434377191317.html

  9. vue-router实现页面的整体跳转

    直接看效果图: 代码地址:https://github.com/YalongYan/vue-router-jump

  10. 【BZOJ4320】ShangHai2006 Homework 分段+并查集

    [BZOJ4320]ShangHai2006 Homework Description   1:在人物集合 S 中加入一个新的程序员,其代号为 X,保证 X 在当前集合中不存在.    2:在当前的人 ...