<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. WCF实现上传图片功能

    初次学习实现WCF winform程序的通信,主要功能是实现图片的传输. 下面是实现步骤: 第一步: 首先建立一个类库项目TransferPicLib,导入wcf需要的引用System.Service ...

  2. 前言和第一章.NET的体系结构

    前言 COM:组件对象模型(Component Object Model COM)源自对象链接和嵌入(Object Linking and Embedding )OLE. DCOM:(Distribu ...

  3. gulp配置,实例演示

    项目完成后的目录 我们所需要的插件为:gulp-minify-css gulp-concat gulp-uglify gulp-rename del 如下图所示,完成后的项目目录结构: 附加,获取pa ...

  4. amchart 图表设置

    官网:https://www.amcharts.com/demos/ 属性介绍:https://docs.amcharts.com/3/javascriptcharts/AmLegend 安装 bow ...

  5. 第二篇: Ansible 安装

    一.配置epel源 wget –O /etc/yum.repos.d/epel.repo http://mirrors.aliyun.com/repo/epel-6.repo 二.安装ansible  ...

  6. JWT简介json web token bear token

    , "exp": 1502360328,(相差3600s) "nbf": , "jti": "R0Gd00AvOW259LGo&q ...

  7. java数据结构-Vector

    1 Vector基础实现为数组 object[] synchronized线程安全 2 扩容使用  System.arraycopy(original, 0, copy, 0,Math.min(ori ...

  8. parse arguments in bash

    There are lots of ways to parse arguments in sh. Getopt is good. Here's a simple script that parses ...

  9. 【python系列】python画报表(Chartkick、Flask)(附中文乱码解决方式)

    chartkick 能够画 javascript 报表, 并且比較美观.可是网上搜了下.非常难找到 python 版本号的,于是查了些资料,摸索了下. 对 Flask 也不非常熟悉,这里就仅仅抛砖引玉 ...

  10. onCreate中获得控件的大小

    @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setC ...