`

Form表单自动提交总结

阅读更多

 

         项目开发过程中遇见了个怪异的问题:form表单下有两个文本框,但是只有第一个回车自动提交,第二个失效。于是针对问题,google了下,总结下form回车提交。

 

1、默认情况下,form表单中只有一个文本框,则不管type是button还是submit,回车后都自动提交;

如果想要阻止回车自动提交,加一个隐藏的文本框即可。


2、 只要有type为submit的按钮存在,一个文本框还是多个文本框都提交(于是前面遇到的问题就很好解决了,加上一个隐藏的submit就行了)

 

3、多个文本框的时候,不提交,用type为button的按钮

 

4、 用button元素时,FF和IE下有不同的表现

        radio和checkbox在FF下也会触发提交表单,在IE下不会

        type为image的按钮,等同于type为submit的效果

 

        5、form表单中的onsubmit句柄会在表单提交之前执行,所以可以在这里控制(return false,表单不会提交)


 6、在onkeydown上直接使用js进行回车键的判断:

if (event.keyCode == 13) {
   //func
}
  

 

分享到:
评论

相关推荐

    JS提交form表单实例分析

    一、javascript 页面加裁时自动提交表单: Form表单: <form method="post" id="myform" action="a.php"> <input type="submit" value="提交表单"> </form> javascript 代码: [removed] ...

    php curl模仿form表单提交图片或文件

    总结,通过PHP的cURL和ThinkPHP5,我们可以轻松地模拟form表单提交,包括图片和文件。理解cURL的工作原理以及如何在TP5中使用它,对于进行复杂的HTTP交互是非常有用的。请确保在实际应用中遵守相关的安全规范,如...

    漂亮的form表单-漂亮的form表单

    "漂亮的form表单"这个主题关注的是如何创建既美观又功能强大的表单,以提高用户体验并提升网站的整体视觉效果。下面将详细介绍关于form表单的相关知识点。 1. **HTML表单基础** HTML中的`<form>`标签用于定义表单...

    Form表单按回车自动提交表单的实现方法

    1.form表单中只有一个input标签,按回车键将自动提交表单 当form表单中只有一个<input type=”text” name=’name’ />时按回车键将会自动将表单提交。 <form id='form1' action='a1.jsp' method='post'&gt...

    FORM表单中文乱码问题分析与解决

    这将使服务器在接收到FORM表单中的数据时自动使用UTF-8对中文进行解码。 对中文的编码方式和解码方式是解决中文乱码问题的关键。使用正确的编码方式和解码方式可以解决中文乱码问题,从而确保FORM表单中的中文参数...

    EXT异步提交FORM表单

    ### EXT异步提交FORM表单知识点详解 #### 一、EXT异步提交FORM表单概述 在现代Web应用开发中,异步提交表单是一种常见的技术手段,它能够提升用户体验,减少页面刷新带来的数据丢失风险,并能有效提高系统的响应...

    javascript实现自动提交form表单

    内含联系方式,不懂用可以问我!多次修改后已无瑕疵,用它实现当页面刷新的时候自动提交表单数据,目前我把它运用在领取某论坛每日登录礼包这种繁琐的小事中,你还可以运用到更有价值的地方去。

    自动生成式form表单

    在IT领域,自动生成式form表单是一种高效且实用的技术,尤其在网页开发和应用程序设计中,它大大简化了用户输入数据的过程。form表单是HTML(超文本标记语言)中的一个重要元素,用于收集用户输入的数据,然后可以将...

    form多表单同时提交以及支持下拉框可编辑源码

    根据给定文件的信息,本文将深入探讨如何在Web应用中实现多表单的同时提交功能,以及如何使用JavaScript来增强下拉框的可编辑性(包括删除、修改与新增选项),并实现聚焦等交互功能。 ### 多表单同时提交 在实际...

    网页表单自动提交

    网页表单自动提交是网络应用中常见的一种技术,主要用于自动化处理数据输入和发送请求到服务器。在易语言这种中文编程环境中实现网页表单的自动提交,可以帮助开发者更高效地完成批量任务或者自动化测试。易语言作为...

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

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

    JavaScript动态创建form表单并提交的实现方法

    本文实例讲述了JavaScript动态创建form表单并提交的实现方法。分享给大家供大家参考,具体如下: 页面布局有些复杂的情况下,可能需要在页面中动态创建一个 form,JavaScript 创建 form 演示如下: // JavaScript ...

    jquery_form_js 表单提交自定义源码

    总结,jQuery Form插件通过`jquery.form.js`提供的功能,让表单提交变得简单且灵活。无论是简单的数据提交,还是复杂的文件上传,都能轻松应对。理解并掌握其源码,能帮助开发者更好地利用这个工具,提升项目开发...

    springmvc-form表单的使用

    ### Spring MVC Form表单的使用详解 #### 一、Spring MVC Form 表单的基本概念 在Web开发中,表单是实现用户与服务器之间交互的重要工具。Spring MVC框架提供了强大的表单支持,允许开发者轻松地处理HTTP请求中的...

    转义表单提交字符处理函数

    ### 转义表单提交字符处理函数 在Web开发中,确保用户输入的数据安全是非常重要的。不正确的处理可能会导致诸如XSS(跨站脚本攻击)等安全问题。因此,对用户提交的数据进行适当的转义是至关重要的。本文将详细介绍...

    表单输入一定长度的字符然后自动提交

    在现代Web开发中,实现表单自动提交是一项实用的功能,特别是在需要用户输入特定长度文本的场景下。本篇文章将详细解析如何通过JavaScript来实现这一功能,并探讨其背后的原理与实践技巧。 #### 一、表单元素与事件...

    layui实现form表单同时提交数据和文件的代码

    `auto: false`表示不会在选择文件后自动提交,而是等待用户点击`#get`按钮。`bindAction`将上传和表单提交绑定在一起。`choose`回调函数用于预览文件,`done`回调则处理服务器返回的结果。 当用户点击“立即注册”...

    Spring下的AJAX和Form表单提交及单/多方法控制器比较

    在本文中,我们将探讨在Spring框架下,使用AJAX与传统Form表单提交的区别,以及单方法控制器和多方法控制器的使用场景。首先,我们来看看AJAX提交与Form表单提交的基本概念。 **AJAX(Asynchronous JavaScript and ...

    如何防止INPUT按回车自动提交表单FORM

    总结来说,防止`<input>`按回车自动提交`<form>`表单,可以通过增加隐藏的`<input>`元素或者使用JavaScript监听并阻止回车键的默认行为。这两种技术在实际开发中都得到了广泛的应用,可以根据项目需求选择适合的实现...

Global site tag (gtag.js) - Google Analytics