form表单提交方式总结一下:

一、利用submit按钮实现提交,当点击submit按钮时,触发onclick事件,由JavaScript里函数判断输入内容是否为空,如果为空,返回false, 不提交,如果不为空,提交到由action指定的地址。

用户帐号
登录密码 1234567891011121314151617181920

二、利用button按钮实现提交,当点击button按钮时,触发onclick事件,由JavaScript里函数判断输入内容是否为空,如果为空,返回false, 不提交,如果不为空,提交到由action指定的地址,由于button按钮不具备自动提交的功能,所以由JavaScript实现提交。

用户帐号
登录密码 1234567891011121314151617181920

三、利用submit按钮实现提交,当点击submit按钮时,先触发onsubmit事件,由JavaScript里函数判断输入内容是否为空,如果为空,返回false, 不提交,如果不为空,提交到由action指定的地址。

用户帐号
登录密码

一、submit提交

在form标签中添加Action(提交的地址)和method(post),且有一个submit按钮()就可以进行数据的提交,每一个input标签都需要有一个name属性,才能进行提交。

<input type=’submit’ value=’登陆’/>

当点击登陆时,向服务端发生的数据是:username=username&password=password.

这种默认的提交方式,一般会进行页面的跳转(不成功时跳转到当前页面)。而有时候我们是对弹出框进行数据提交的,希望提交成功则关闭弹出框并刷选父页面,失败则提示失败原因,且弹出框不关闭。此时可以采用Ajax进行数据提交.

二、Ajax提交form表单

$(’#documentForm’).submitForm({
url: “/Document/SubmitDocumentCreate”,
dataType: “text”,
callback: function (data) {
endFileUpload();
data = eval("(" + data + “)”);
alert(data.Content);
if (data.Result > 0) {
location.href = data.Redirect;
}
},
before: function () {
startFileUpload();
var errMsg = “”;
}
}).submit();

此时可以在callback函数中对请求结果进行判断,然后执行不同的动作(页面跳转或刷选数据、提醒错误都可以)

三、Easyui的form插件

通过easyui的form插件也可以达到上面的目的。

$(’#ff’).form(‘submit’, {

url:…,

onSubmit: function(){

//进行表单验证

//如果返回false阻止提交

},

success:function(data){

alert(data)

}

});

四、form表单提交附件

需要设定form的enctype="multipart/form-data"并且添加

而且附件只能通过submit方法进行提交,


form表单的提交方式相关推荐

  1. form表单的提交方式(get和post的区别)

    form表单的提交方式 请求方式有:POST.GET.OPTIONS.DELETE.TRACE.PUT.CONNECT 主要请求方式 form表单提交方式有很多,常用的有post和get post和g ...

  2. form表单使用put方式提交

    form表单的提交方式只支持GET或者POST,为了实现restful风格,需要使用form表单实现PUT和DELETE方式的提交,对于这种情况,spring提供了过滤器 HiddenHttpMeth ...

  3. 防止Form表单重复提交的客户端及服务器端的方式

    参考:https://www.cnblogs.com/xdp-gacl/p/3859416.html 上文只是介绍了form表单提交,没有介绍form表单异步提交 上文只是介绍了单个Servlet的处 ...

  4. 使用ajax方法实现form表单的提交

    2019独角兽企业重金招聘Python工程师标准>>> 在使用form表单的时候,一旦点击提交触发submit事件,一般会使得页面跳转,页面间的跳转等行为的控制权往往在后端,后端会控 ...

  5. JQuery表单的提交方式

    在MVC中,jQuery表单的提交方式尤为重要,表单的提交需要视图和控制器的密切连接使用. 控制器与视图的连接.接收分为三种: 自动提交:submit , action , methion 手动提交: ...

  6. html表单通过js提交表单提交,JavaScript动态创建form表单并提交的实现方法

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

  7. 防止form表单重复提交的几种方案

    阅读目录 前言 form重复提交场景 解决方案 一:前端利用JavaScript防止表单重复提交 二:利用Session防止表单重复提交 三:使用重定向也可以解决form表单重复提交问题 参考 前言 ...

  8. $.ajaxSubmit form表单ajax提交

    Form表单ajax提交 <style>#agreementSub{margin-top: 20px;display: block;width: 100px;height: 40px;te ...

  9. 前后端交互之使用ajax方法实现form表单的提交

    转载于:使用ajax方法实现form表单的提交 - 程序员十三 - 博客园 (cnblogs.com)  οnsubmit="reutrn false":表示禁止表单提交. dat ...

最新文章

  1. 伯克利团队正在训练AI成为外科实习医生
  2. 彻底排除微软媒体中心被软件限制问题
  3. 计算机视觉与深度学习 | 激光雷达(Lidar)发展史及其应用
  4. JVM 调优实战--jvisualvm远程连接使用教程
  5. 是谁的名字缩写_浅谈女枪 or MF之争 盘点LOL中常见的英雄英文名缩写
  6. powershell 压缩_如何使用PowerShell返回数据使用,索引压缩和行信息
  7. 棋盘问题 ( POJ -1321 )(简单DFS)
  8. 关于python的论文the philosophy_Philosophy in Python
  9. u盘如何安装2003服务器系统安装,u盘怎么安装win server2003系统是iso
  10. 基于STM8S003F3的数字温度计制作
  11. 中间件是什么?通俗易懂的解释
  12. Html 实现amr文件播放
  13. CCIE-MPLS路由传递
  14. 哈希表的概念(散列表)
  15. 双子星量子计算机,【前沿】“前途”无量的量子科技
  16. python对txt文本文件边读边写,同时读取和写入的方式修改文件
  17. SQL实战(2)——国庆期间每类视频点赞量和转发量
  18. 在群晖NAS上搭建导航页_通过Web Station搭建
  19. DAY 09 Python 操作Excel
  20. 论文阅读笔记----《From Easy to Hard: Two-stage Selector and Readerfor Multi-hop Question Answering》

热门文章

  1. windows下编译php扩展,windows下开发并编译PHP扩展的方法_php
  2. 实体店转型做社交电商该如何做?
  3. ubuntu 支持 雷电3外置显卡扩展坞的版本有哪些?
  4. 如何识别不同的编程语言(上)
  5. 网络测试常用的命令-比较ping,tracert和pathping等命令之间的关系
  6. 龙芯2K1000实战开发-项目整体框架介绍
  7. Glide加载圆形图片和自定义圆角图片和对指定的角加载圆角
  8. HTML学生个人网站作业设计:基于HTML+CSS+JavaScript设计多用途的图文展示博客HTML模板(16页)
  9. 蓝牙耳机哪款质量最好?500元真无线蓝牙耳机推荐
  10. Mysql中的explain查看执行计划