首先需要引入jquery.form.js
之后即可使用


本示例为上传文件+form表单提交
使用的方法是提交地址写在form表单当中,在提交前进行检查工作,检查内容是否符合规范(是否为空),若为空则弹出提示信息,并不进行发送处理。
  1. <%--
  2. Created by IntelliJ IDEA.
  3. User: 水之笔记
  4. Date: 2017/3/9
  5. Time: 22:02
  6. To change this template use File | Settings | File Templates.
  7. --%>
  8. <%@ page contentType="text/html;charset=UTF-8" language="java" %>
  9. <html>
  10. <head>
  11. <title>上传获奖作品</title>
  12. <script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/jquery.js"></script>
  13. <script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/is_null.js"></script>
  14. <script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/jquery.form.js"></script>
  15. <script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/competition_name.js"></script>
  16. <script type="text/javascript">
  17. $(document).ready(function () {
  18. $("#uploadForm").ajaxForm({
  19. resetForm: true,
  20. clearForm: true,
  21. //定义返回JSON数据,还包括xml和script格式
  22. dataType: 'json',
  23. // 在发送之前进行的操作,如果有问题,返回false即可不会进行提交
  24. beforeSend: function () {
  25. //表单提交前做表单验证
  26. if (isNull($("#name").val()) || isNull($("#year").val()) || $("#competition") == "请选择") {
  27. alert("不能为空");
  28. return false;
  29. }
  30. if ($("#file1").get(0).files[0] == null) {
  31. alert("请至少上传源文件");
  32. return false;
  33. }
  34. return true;
  35. },
  36. success: function (data) {
  37. //提交成功后调用
  38. alert(data.messageContent);
  39. window.location.reload();
  40. }
  41. });
  42. });
  43. </script>
  44. </head>
  45. <body>
  46. <div>
  47. <form method="post" enctype="multipart/form-data" id="uploadForm"
  48. action="${pageContext.request.contextPath}/background/worksInsert">
  49. 作品名称:<input type="text" name="name" id="name"><br>
  50. 参赛年份:<input type="text" name="year" id="year"><br>
  51. 参加竞赛:<select name="competition" id="competition">
  52. <option value="请选择">请选择</option>
  53. </select><br>
  54. 源文件上传:<input type="file" name="file1" id="file1"><br>
  55. 展示文件上传:<input type="file" name="file2" id="file2"><br>
  56. 附件上传:<input type="file" name="file3" id="file3"><br>
  57. <input type="submit" value="提交">
  58. </form>
  59. </div>
  60. </body>
  61. </html>

jQuery.form的使用方法的更多相关文章

  1. jQuery.Form.js使用方法

    一.jQuery.Form.js 插件的作用是实现Ajax提交表单. 方法: 1.formSerilize() 用于序列化表单中的数据,并将其自动整理成适合AJAX异步请求的URL地址格式. 2.cl ...

  2. ajax上传图片 jquery插件 jquery.form.js 的方法 ajaxSubmit; AjaxForm与AjaxSubmit的差异

    先引入脚本  这里最好是把jquery的脚本升级到1.7 <script src="js/jquery-1.7.js" type="text/javascript& ...

  3. 如何理解jQuery中的ajaxSubmit方法

    版权声明:本文为博主原创文章,转载请标注:www.cnblogs.com/gdsblog 刚刚学习中,使用到了ajaxSubmit,犹豫以前没有接触㢧这个,所以刚开始是一脸懵逼状态,最后通过查找资料的 ...

  4. jQuery插件 -- Form表单插件jquery.form.js<转>

    jQuery Form插件是一个优秀的Ajax表单插件,可以非常容易地.无侵入地升级HTML表单以支持Ajax.jQuery Form有两个核心方法 -- ajaxForm() 和 ajaxSubmi ...

  5. 关于JQuery.form.js异步上传文件点滴

    好久没动代码了,前几天朋友委托我帮忙给做几个页面,其中有个注册带图片上传的页面.已之前的经验应该很快就能搞定,没想到的是搞了前后近一天时间.下面就说说异步上传的重要几个点,希望自己下次遇到此类问题的时 ...

  6. jquery.form.js不能解决连接超时(timeout)的解决方法

    最近在使用jquery.form.js提交包含文件的表单时,碰到了一个问题:当碰上网速较慢时,而我们又设置了timeout时,例如: var options = { timeout: 3000 //限 ...

  7. jQuery form插件的使用--使用 fieldValue 方法校验表单

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  8. jquery.form.js实现将form提交转为ajax方式提交的使用方法

    本文实例讲述了jquery.form.js实现将form提交转为ajax方式提交的方法.分享给大家供大家参考.具体分析如下: 这个框架集合form提交.验证.上传的功能. 这个框架必须和jquery完 ...

  9. jquery.form.js用法之清空form的方法

    本段代码摘取自jquery.form.js中,由于觉得该方法的使用性非常强,同时也可独立拿出来使用.该段代码言简意赅可以很好的作为学习参考. /** * Clears the form data. T ...

随机推荐

  1. Qt写入unicode编码格式的文本(用QChar写入BOM标记,并且列出所有Qt支持的字符集)

    1.文本流设置unicode小端模式 2.写入文本前两个字节FF FE 3.字符串转成unicode编码 QList<QByteArray> list = QTextCodec::avai ...

  2. 在视图上创建ListCtrl的做法

    作者:朱金灿 来源:http://blog.csdn.net/clever101 今天介绍下如何在一个视图上动态创建一个ListCtrl. 1.新建一个MFC的单文档工程,这里暂定名字为ListDem ...

  3. 【t011】最小覆盖子串

    Time Limit: 1 second Memory Limit: 32 MB [问题描述] 给定一个含有N个元素的序列A,你的任务就是求出序列A的最小覆盖子串的长度. 本题中的一些定义: 串S,是 ...

  4. 改变浏览器中默认的ctrl+s方法

    在一般的情况下,我们在浏览网页的时候按下ctrl+s,浏览器会弹出一个保存网页的框. 但是在一些特定的网页中,我们希望ctrl+s不是弹出默认的保存窗口,而是进行一下别的操作. 比如在我们使用简书的时 ...

  5. 关于 Mesos,你知道多少?13 个问题带你深入了解 Mesos

    听过不少人在讨论 Mesos,然而并不是很明白 Mesos 到底能够解决什么问题,使用场景是怎样的,周伟涛(国内较早一批接触使用 Docker,Mesos 等技术的开发者)用一句话形容它, Mesos ...

  6. js限制文本框input只能输入数字

    JS判断只能是数字和小数点. ,文本框只能输入数字代码(小数点也不能输入) 复制代码 代码示例:<input onkeyup="this.value=this.value.replac ...

  7. C# 静态构造函数,静态变量执行顺序(升华版)

    上篇 是基本语法基础下的执行顺序,包括继承这个维度下的执行顺序,我们可以依照的规律顺下来,下面我们看下一些摸不到头脑的情况 我们实验 一个 类中的方法 去调用另一个非继承类的情况,  我们主要看下  ...

  8. Session Redis Nginx

    Session + Redis + Nginx 一.Session 1.Session 介绍 我相信,搞Web开发的对Session一定再熟悉不过了,所以我就简单的介绍一下. Session:在计算机 ...

  9. docker入门2:基础操作(1)

    -- 列出所有的容器 docker ps -a  (没有-a就是只列出启动的) -- 开启/关闭/移除容器 docker start|stop|rm CONTAINER_ID|CONTAINER_NA ...

  10. WPF--3Dmax+blend+WPF综合运用

    引自:http://blog.sina.com.cn/s/blog_95dbdf9e0100we3z.html 本人小菜,WPF刚入门,只是写一下最近的项目心得.欢迎各位前辈们前来拍砖指正,感激不敬! ...