--------------------------------------------------------------------------------------------------

实现"回车!=提交"的问题,一般可以从"按钮的type类型" 和 "输入框个数"两处着手。

------------------------------@chenwei <www.farwish.com>-------------------------------

默认情况下,单个输入框,无论按钮的type="submit"还是type="button"类型,回车即提交。

1.当type="submit"时,无论有几个type="text"输入框,回车均表示提交。(submit)

2.当type="button"时,且存在多个输入框,回车不提交。(button)

3.解决单个输入框的回车即提交问题,参考第二点:可以增加一个input="text",隐藏; 然后type类型为button。

在实际应用中,input输入框很少只有一个的情况,那么只需记住第二条即可应对。

使用JS事件阻止表单提交 不在本文讨论范围,当然也是可以实现的。

--------------------------------------------------------------------------------------------------

简单实现"回车!=提交"(去除表单的回车即提交)的更多相关文章

  1. 按下回车默认提交form表单问题

    最近开发中碰到一个问题,项目中有几个列表展示页面,允许用户通过查询条件模糊查询数据.用户录入关键字后点击回车会调用查询方法根据关键字查询,原先功能没有问题,但是最近发现在查询输入框中按下回车会直接刷新 ...

  2. Vue Element-ui 框架:路由设置 限制文件类型 表单验证 回车提交 注意事项 监听事件

    1.验证上传文件的类型: (1)验证图片类型 <template> <el-upload class="avatar-uploader" action=" ...

  3. jQuery form插件的使用--用 formData 参数校验表单,验证后提交(简单验证).

    Form Plugin API 里提供了很多有用的方法可以让你轻松的处理表单里的数据和表单的提交过程. 测试环境:部署到Tomcat中的web项目. 一.引入依赖js <script src=& ...

  4. 用JavaScript实现表单按回车自动提交

    JavaScript实现表单form1按回车自动提交代码如下: <script type="text/javascript"> function submitMe() ...

  5. formidable处理提交的表单或文件的简单介绍

    一般来说,客户端向服务端提交数据有GET和POST这两种方式,在之前的文章node.js当中的http模块与url模块的简单介绍当中我们可以知道通过req.url与url模块的配合处理可以快速得到客户 ...

  6. formidable处理提交的表单或图片文件的简单介绍

    一般来说,客户端向服务端提交数据有GET和POST这两种方式,在之前的文章node.js当中的http模块与url模块的简单介绍当中我们可以知道通过req.url与url模块的配合处理可以快速得到客户 ...

  7. 如何使用PHP验证客户端提交的表单数据

    PHP 表单验证 本章节我们将介绍如何使用PHP验证客户端提交的表单数据. PHP 表单验证 在处理PHP表单时我们需要考虑安全性. 本章节我们将展示PHP表单数据安全处理,为了防止黑客及垃圾信息我们 ...

  8. Jquery通过Ajax方式来提交Form表单

    今天刚好看到Jquery的ajax提交数据到服务器的方法,原文是: 保存数据到服务器,成功时显示信息. jQuery 代码: $.ajax({ type: "POST", url: ...

  9. ajax提交form表单资料详细汇总

    一.ajax提交form表单和不同的form表单的提交主要区别在于,ajax提交表单是异步提交的,而普通的是同步提交的表单.通过在后台与服务器进行少量数据交换,ajax 可以使网页实现异步更新.这意味 ...

随机推荐

  1. RHEL7安装图像化桌面

    RHEL7安装图像化桌面 作者:Eric 微信:loveoracle11g 在安装系统的时候选择的是默认的Minimal Install RHEL7系统安装完成开机启动后发现没有图形化 Linux系统 ...

  2. 2018北美部分CS项目学费

    yearly cost from official website USC 城里 24credit about 49k + cost of room&food BU 城里 NEU 65k 城里 ...

  3. 【Unix网络编程】chapter6IO复用

    chapter6  6.1 概述 I/O复用典型使用在下列网络应用场合. (1):当客户处理多个描述符时,必须使用IO复用 (2):一个客户同时处理多个套接字是可能的,不过不叫少见. (3):如果一个 ...

  4. HBase原理和安装

    HBase的基本概念和安装: Hbase简介 HBase的原型是Google的BigTable论文,受到了该论文思想的启发,目前作为Hadoop的子项目来开发维护,用于支持结构化的数据存储. 官方网站 ...

  5. Spring boot 下使用 Swagger

    通过Swagger 可以更好的将后台的RESTfull API文档化,如下图所示: 1. Swagger 主要依赖以下两个jar包: <!-- https://mvnrepository.com ...

  6. 如何使用IntelliJ集成nodejs进行接口测试<response demo>

    1.相关的配置及安装,在如下地址进行参考,这位大师写得也挺好(mac和windows都可以下载) https://www.jianshu.com/p/dd2d2d0ff133 2.在集成nodejs的 ...

  7. mongo数据库的安装与使用

    下载mongoDB安装包.https://pan.baidu.com/s/1cvSJtc 默认安装.会在系统盘的program Files文件夹下法相一个MongoDB的文件夹,这个就是软件安装的位置 ...

  8. 【Jmeter自学】Jmeter作用域(五)

    .Jmeter作用域 .Jmeter参数化 .Jmeter的集合点 .jmeter之关联 1.Jmeter作用域 问题: 每个元件作用域 层次结构确认 每个元件执行顺序 配置元件 前置 定时器 Sam ...

  9. 硬盘读取不了-->>完美解决

    说明:电脑装了两个硬盘,一个固态一个机械,装完系统之后读取不到机械硬盘的数据,网上很多人都说格式化之后分盘,但是!!!里面的数据咋办?千万别自己倒腾转换格式什么的,一不小心数据真的丢了,那就再也找不回 ...

  10. numpy+pandas 基础学习

    #-*- coding:utf-8 -*- import numpy as np; data1=[1,2,3,4,5] array1=np.array(data1) #创建数组/矩阵 # 使用nump ...