<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. 安装Reshaper后Intellisense失效

    安装Reshaper后Intellisense失效或希望用vs2017的Intellisense功能 安装完毕后,IDE 的智能提示(Intellisense)便会默认使用 Resharper 的提示 ...

  2. 【HttpClient4.5中文教程】【第一章 :基础】1.1运行请求(二)

    很多其它HttpClient4.5中文教程请查看:点击打开链接 ==================================================================== ...

  3. MySQL四:表操作

    阅读目录 表介绍 一 创建表 二 查看表结构 三 数据类型 四 表完整性约束 五 修改表ALTER TABLE 六 复制表 七 删除表 八 完整性约束 九 数据类型 表介绍 表相当于文件,表中的一条记 ...

  4. 堆排序算法的java实现

         堆积排序(Heapsort)是指利用堆积树(堆)这种数据结构所设计的一种排序算法,可以利用数组的特点快速定位指定索引的元素.堆排序是不稳定的排序方法,辅助空间为O(1), 最坏时间复杂度为O ...

  5. Python之内置类型

    python有6大内置类型 数字.序列.映射.类.实例.异常. 下面就慢慢来说明: 1.数字 有3个明确的数字类型,整型,浮点型及复数.另外,布尔是整型的一个子类型. (另外标准库还包含额外的数字类型 ...

  6. window平台安装 MongoDB(二)

    MongoDB提供了可用于32位和64位系统的预编译二进制包,你可以从MongoDB官网下载安装,MongoDB预编译二进制包下载地址:http://www.mongodb.org/downloads ...

  7. Photoshop中磁力套索的一种简陋实现(基于Python)

    经常用Photoshop的人应该熟悉磁力套索(Magnetic Lasso)这个功能,就是人为引导下的抠图辅助工具.在研发领域一般不这么叫,通常管这种边缘提取的办法叫Intelligent Sciss ...

  8. Prometheus+Grafana搭建监控系统

    之前在业务中遇到服务器负载过高问题,由于没有监控,一直没发现,直到业务方反馈网站打开速度慢,才发现问题.这样显得开发很被动.所以是时候搭建一套监控系统了. 由于是业余时间自己捯饬,所以神马业务层面的监 ...

  9. Xcode8:"subsystem: com.apple.UIKit, category: HIDEventFiltered, enable_level: 0" 的警告

    运行xcode8遇到这个警告: subsystem: com.apple.UIKit, category: HIDEventFiltered, enable_level: 0, persist_lev ...

  10. ANDROID版本号号和版本号名称的重要性介绍

    转载请注明出处http://blog.csdn.net/y150481863/article/details/41249159,来自[http://blog.csdn.net/y150481863] ...