`
Donald_Draper
  • 浏览: 953291 次
社区版块
存档分类
最新评论

如何阻止Form表单中的Button自动提交

    博客分类:
  • HTML
阅读更多
在Form表单中加button的话,点击事件触发会自动提交表单,如何阻止默认行为呢?
以下为示例:
<form action="test.do" method="post" name="Form" id="Form">
	<table>
		<tr>
		<td style="vertical-align:top;"><button class="btn btn-mini btn-light" onclick="return search();"  title="查询"><i id="nav-search-icon" class="icon-search"></i></button></td>
		</tr>
	</table>
</form>

一般点击事件为:onclick="search();",容易触发表单默认提交行为;
改为onclick="return search();"即可
function search(){
    if(true){
    	$("#Form").submit();
    }
    else{
    	bootbox.alert("请填写至少一个查询条件");
    	return false;
    }
}

分享到:
评论

相关推荐

    JavaScript在form表单中使用button按钮实现submit提交方法

     在form表单提交中,使用button来间接完成submit的提交更为灵活。下面是实现方法: 使用button按钮实现submit提交,需要在button标签中的使用onclick方法,然后在JavaScript中实现具体,代码如下: &lt;head&gt; ...

    解决layui中的form表单与button的点击事件冲突问题

    layui的form表单位置和button标签的位置重合,会使得button的...以上这篇解决layui中的form表单与button的点击事件冲突问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持软件开发网。

    html的form表单实例介绍

    html的form表单中button等实例介绍

    通过button将form表单的数据提交到action层的实例

    下面小编就为大家带来一篇通过button将form表单的数据提交到action层的实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧

    layui form表单提交后实现自动刷新

    2、提交表单,获取不到form表单中的数据。 有人说,是因为给了一个id,并没有给name属性,用惯了jquery。我懒得去找这个问题,因为,以前提交数据使用jQuery的form提交的话用的是实例化的方法serialzeab

    jquery管理cookie和form的js

    内含jquery管理cookie的js和管理form的js,直接在jsp页面引用,方便对cookie的操作。以及包含form.js。

    巧用js提交表单轻松解决一个页面有多个提交按钮

    代码如下: ”javascript” name=”code”&gt;function check(txt){ $j(“form”).submit(function(){ if($txt==”提交”){ this.action=”doAddMessage.action?button=提交”; this.submit(); }else{ this.action=”...

    【开源】jQuery oform beta 0.1.5 - form 表单美化插件源代码

    jQuery oform beta 0.1.5 - form 表单美化插件源代码 版权:zhang yang soft 交流E-Mail:oceancode@163.com 浏览器支持:IE、Firefox、Opera , google chrome (谷歌) 版本说明: 1. beta 0.1.0 版 支持input...

    网页中回车后form自动提交跳到其他页面的解决方法

    网页回车后form自动提交,跑到其他页面 有个查询的form,本来是希望点击查询时才查询的,结果测试到回车时跑到其他页面去了。 复制代码代码如下: &lt;form action=”notice.php” method=”get”&gt; … &lt;...

    element-ui如何防止重复提交的方法步骤

    先说对话框(Dialog)里的表单提交 错误方案 说起错误方案,比如,点击提交按钮,本地验证,验证通过立即让按钮不可点,这些没问题,而我的错误点概括是:在某个最后执行的回调函数的最后一行,我做了2个操作:1,...

    微信小程序提交form操作示例

    本文实例讲述了微信小程序提交form操作。分享给大家供大家参考,具体如下: 在微信小程序中也存在form组件,bindsubmit这个属性可以用于... 表单中 formType 为 submit 的 &lt;button/&gt; 组件来控制的,示例如下:

    html中关于form与表单提交操作的资料集合

    这里我们介绍一下form元素与表单提交方面的知识。 form元素 form元素的DOM接口是HTMLFormElement,继承自HTMLElement,因而它与其他的HTML元素拥有相同的默认属性,不过它自身还有几个独有的属性和方法: 属性值 ...

    Form表单及django的form表单的补充

    :放在form表单中,会有一个提交事件,会提交form数据, &lt;input type=”button” value=”提交“&gt; :是一个单纯的按钮,没有任何默认事件, 先匹配url和视图函数 from django.conf.urls import url from ...

    微信小程序组件系列:form表单讲解

    form表单组件说明:  表单,将组件内的用户输入的&lt;switch&gt; &lt;input/&gt; &lt;checkbox&gt; &lt;slider&gt; &lt;radio&gt;  提交。  当点击 &lt;form/&gt; 表单中 formType 为 submit 的&lt;button/&gt; 组件时,会将表单组件中...

    Ajax提交Form表单页面仍会刷新问题的快速解决办法

    主要介绍了 Ajax提交Form表单页面仍会刷新问题的快速解决办法,以及form 表单中存在button时ajax提交后自动刷新问题,需要的朋友可以参考下

    微信小程序form表单组件示例代码

    组件时,会将表单组件中的 value 值进行提交,需要在表单组件中加上 name 来作为 key。 属性名 类型 说明 report-submit Boolean 是否返回formId用于发送模板消息 bindsubmit EventHandle 携带form中的数据...

    javascript实现点击提交按钮后显示loading的方法

    主要介绍了javascript实现点击提交按钮后显示loading的方法,涉及javascript动态设置页面元素样式的相关技巧,需要的朋友可以参考下

Global site tag (gtag.js) - Google Analytics