问题描述

在设计表单时,表单内有一个按钮<button>,该按钮是用来获取其他数据或执行其他操作的。并不是让他提交表单。

解决方案

1) 设置 form 的 onsubmit='return false';

2)将按钮改成如下格式 <input type="button">

3) 在处理函数中使用

$( "a" ).click(function( event ) {
event.preventDefault();
$( "<div>" )
.append( "default " + event.type + " prevented" )
.appendTo( "#log" );
});

在 vue 中可以使用 prevent 修饰符进行修饰

前端表单中有按钮button自动提交表单的更多相关文章

  1. form表单下的button按钮会自动提交表单的问题

    form表单下的button按钮会自动提交表单的问题 2017年01月05日 18:02:44 蓝色水 阅读数:18012更多 个人分类: asp.net   form表单下的按钮在没有指定type类 ...

  2. html中button自动提交表单?

    在ie中,button默认的type是button,而其他浏览器和W3C标准中button默认的属性都是submit

  3. html button自动提交表单问题

    在ie中,button默认的type是button,而其他浏览器和W3C标准中button默认的属性都是submit,所以在chrome中,需要使用<button type="butt ...

  4. 表单中submit和button按钮的区别!

    对于表单的按钮以前知道submit和button有区别,但没有深入探索,今天刚好又碰到这个问题,看了下网络上这位朋友已经有现成的总结了,而且比较到位,拿来跟大家分享下(原文地址:http://blog ...

  5. ssi-uploader上传图片插件,点击选择文件按钮自动提交表单解决办法

    先介绍一下这款插件,然后再谈使用中可能遇到的问题 ssi-uploader是一个JQuery的图片上传插件,界面比较美观 github地址:https://github.com/ssbeefeater ...

  6. alert警告框点击确定后自动提交表单

    转载于  :https://zhidao.baidu.com/question/619375120140398412.html 在页面中有多个input type="text"的文 ...

  7. java 传入用户名和密码并自动提交表单实现登录到其他系统

    不用单点登录,模拟远程项目的登录页面表单,在访问这个页面的时候自动提交表单到此项目的登录action,就可以实现登录到其他系统. ssh框架项目 1.以下是本地系统的action代码: import ...

  8. <button>会自动提交表单吗?

    点击button以后,表单先由ajax提交,然后无论后台返回什么结果,页面都会跳转到表单action属性指定的路劲,也就是login.html使用的是html.jquery.javascript,后台 ...

  9. form表单中多个button按钮必须声明type类型

    最近在做一个后台管理系统,发现了一个小bug: 问题描述:form表单中有多个button按钮(以下图为例),如果第一个button不写type属性,那么点击第一个button按钮会触发submit事 ...

随机推荐

  1. 对Bootloader(引导加载程序)的几点理解

    1.在加电复位之后,大多数处理器都会从一个默认的地址处获取代码.比如MIPS结构的CPU会从0xBFC00000处取第一条指令,而ARM结构的CPU则从地址0x00000000处取第一条指令.因此,在 ...

  2. JavaScript正则式练习

    使用正则式匹配第一个数字和最后一个数字,使用环视 str2 = 09051 : Fast Food Restaurants - Concession Stands/Snack Bars Delicat ...

  3. time series review

    https://pdfs.semanticscholar.org/fc9c/1a94a15dd44c8c61b3e4841ecb9505f8cd37.pdf https://edoc.hu-berli ...

  4. Spring面试题一

    目录一.Spring工作原理 二.为什么要用Spring三.请你谈谈SSH整合四.介绍一下Spring的事务管理五.什么是依赖注入,依赖注入的作用是什么? 六.什么是AOP,AOP的作用是什么? 七. ...

  5. nuxt框架学习

    1.static和assets文件夹区别 相同点:都可以存放静态文件 不同:assets下的文件 webpack会处理:static文件夹下的文件不会处理. 2.middleware middlewa ...

  6. Java继承Exception自定义异常类教程以及Javaweb中用Filter拦截并处理异常

    转载请注明原文地址:http://www.cnblogs.com/ygj0930/p/6403033.html 在项目中的应用见: https://github.com/ygj0930/CoupleS ...

  7. cocos2d-js 调试办法 断点调试 Android真机调试

    一 使用浏览器chrome打开程序,进行调试.跟普通js程序一样. 要么自行搭建服务器,利用python脚本,或者用其他服务器程序(LAMP或XAMPP).然后用浏览器打开服务器地址. 要么直接使用c ...

  8. 解决CSS的position:absolute中left效果

    有时候css中设置了position:absolute,left:100px,但是如果我们不想要这个left怎么办呢,当然你直接删除就可以,但是如果是框架的css,你直接删除就有问题了,这时候该怎么办 ...

  9. 【php+js】用PHP或者JS怎么显示搜索到的关键字高亮,及其文章里包含关键字的一小段

    1.想要实现的效果: 2.思路:小数据量使用 php的正则替换,即[preg_replace()]函数 -->> 支持多个关键词高亮显示,中间参数1和参数2放入对应的数组即可. $titl ...

  10. 【php页面表单提交】form校验后再提交,非ajax提交

    form表单校验后,在执行提交动作: <form method="post" action="{:U('Custom/addmsg')}" id=&quo ...