`
yuanfen860913
  • 浏览: 119886 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
文章分类
社区版块
存档分类
最新评论

[奇怪]一个关于type=submit 和 onsubmit的问题

 
阅读更多

原代码是这样的:

function doSearch() {
$("#mainForm").submit(); 1
return false;2
}
<form onsubmit="doSearch();"> 3
<input type="submit" value="查询"/> 4

</form>

这样提交表单,你觉的表单会提交几次呢?

答案是:两次,

如果,3 改为 onsubmit="return doSearch();" 那么表单提交几次呢。

答案是一次

如果 2 改为 return null, 或者, return undefined 那么表单提交几次呢

答案是两次

也就是说,如果,表单里,有submit按钮,那么单击该按钮,那么该表单,就会查找是否有onsubmit属性,如果存在,就调用该属性 对应的函数,函数返回值,决定onsubmit 属性的是否值,只是,onsubmit的是否,值,onsubmit属性,判断属性是否返回,如果有返回,就是有return,如果,返回是false则,不提交表单,其余的均提交表单。

同样,如果你的doSearch函数,不给返回值,该表单页会提交两次!!

所以,如果,你要使用button是submit ,那么在form表单,的onsubmit属性里,必须给return,函数,要不,表单则会重复提交。

按钮是 submit 可以自动支持enter【回车】事件!!要不,如果你用type=button,你还得捕获回车事件。

个人意见,欢迎拍砖!!

分享到:
评论

相关推荐

    浅析一个表单多个Submit按钮的简单实现方法

    var action = event.target.querySelector('input[type=submit]:checked').name; if (action === 'action1') { // 执行提交1的逻辑 } else if (action === 'action2') { // 执行提交2的逻辑 } event....

    JS定义网页表单提交(submit)的方法

    这段代码表示网页表单提交时不是提交到指定的页面,而是执行一个特定的函数 [removed] function saveInfo() { localStorage.setItem(name,$(#name).val()); } [removed] &lt;form id=register onSubmit=return ...

    让submit只提交一次

    在探讨“让submit只提交一次”的技术实现时,我们深入剖析了如何在Web表单提交过程中避免重复提交的问题,这是一个在Web开发中常见的需求,尤其是在处理敏感操作或交易时尤为重要。下面,我们将从多个角度详细解析这...

    submit表单提交,onsubmit验证拦截

    submit表单提交,onsubmit验证拦截 免去了用button按钮click点击事件ajax请求

    页面提交submit的几种方法

    解决这类问题的一个常见做法是在接收参数时进行编码转换,例如: ```java String phone = request.getParameter("phone") == null ? "" : new String(request.getParameter("phone").trim().getBytes("ISO-8859-1")...

    form的OnSubmit和input type=image使用介绍

    这里如果有&lt;input type="image"&gt; 那么直接按这个图像后会提交...form name=”F1″ onSubmit=”fuck();”&gt; &lt;input type=”image” src=”” width=”51″ height=”20″&gt; &lt;/form&gt;&lt;/span&gt; 另外一

    两个SUBMIT按钮,如何区分处理

    在网页设计中,有时我们需要在一个表单中设置多个提交(SUBMIT)按钮,以便执行不同的操作,例如“修改”和“删除”。面对这种情况,我们如何在服务器端区分这两个按钮的点击事件呢?以下两种方法可以帮助你实现这一...

    表单元素的submit()方法和onsubmit事件应用概述

    表单元素拥有submit方法,同时也具有onsubmit事件句柄,用于监听表单提交。可以使用elemForm.submit();方法触发表单提交。1、表单元素中出现了name=”submit”的元素这种情况下elemForm.submit();将不会触发表单提交...

    button没有指定type为submit点击按钮跳转不到指定url

    `type`属性是`&lt;button&gt;`的一个关键属性,用于定义按钮的类型和行为。这个属性有以下几种可能的值: 1. `submit`:这是默认值(对于非IE浏览器),表示当用户点击该按钮时,表单会被提交给服务器。 2. `reset`:点击...

    jsp有关表单的操作

    &lt;input type=submit &gt; function doMethod(){ if(document.forms[0].ch1.checked){ alert(document.getElementsByName("ch1")[0].value); } //document.forms[0].submit(); } 例子2:单选按钮

    Form表单的action和onSubmit示例介绍

    input type=submit /&gt;提交时进行一个函数验证。。 第二:要说执行的先后顺序,个人理解是onSubmit在先,先验证,验证返回false时,则无法到达action=url地址。如果是返回true或者没有返回值是,则通过且转向url...

    提交按钮的name='submit'引起的js失效问题及原因

    例如,在上述代码片段中,我们看到一个ID为"pquery"的表单,其中有一个`name="submit"`的提交按钮。如果用户点击这个按钮,浏览器可能会直接发起表单提交,而不是执行与该按钮相关的任何JavaScript事件处理函数,如`...

    input submit、button和回车键提交数据详解

    例如,`&lt;form onsubmit="return validateForm()"&gt;`,这里 `validateForm` 是一个函数,如果函数返回 `false`,表单提交将被阻止。这在确保表单数据有效性和安全方面非常有用,避免了无效或错误的数据被提交到服务器...

    表单Form的submit事件不响应的解决方法

    下面是一个集成了上述解决方案的代码示例,它展示了如何通过不同的方式来触发表单提交时的`submit`事件: ```javascript // 针对IE浏览器的代码 if(form.fireEvent){ form.fireEvent('onsubmit'); } else if ...

    不用SUBMIT可以实现的多个按钮的功能

    &lt;form id="myForm" onsubmit="event.preventDefault()"&gt; ``` 4. **表单数据处理**:如果需要在点击按钮时处理表单数据,可以使用`&lt;form&gt;.elements`对象来访问表单内的输入元素,或者使用`FormData`对象来构建和...

    在一个form用一个SUBMIT(或button)分别提交到两个处理表单页面的代码

    form onsubmit=”aa(this);”&gt; &lt;input type=”text” name=”” value=”test” /&gt;&lt;input type=”submit” value=”提交” /&gt; &lt;/form&gt; &lt;iframe src=”” name=”fA” ...

    JS获得多个同name 的input输入框的值的实现方法

    具体代码如下所示: ... &lt;form id=login-form method=post onsubmit=return checkForm()&gt; ...input type=password id...button type=submit&gt;Submit&lt;/button&gt; &lt;/form&gt; js代码 function checkForm() { v

    onsubmit阻止form表单提交与onclick的相关操作

    需要注意的是,如果表单提交是通过一个普通按钮(`&lt;input type="button"&gt;`)的`onclick`事件中调用`form.submit()`,那么`onsubmit`事件不会自动触发,需要手动调用。 示例: ```html &lt;form action="index.jsp" ...

Global site tag (gtag.js) - Google Analytics