首先需要引入jquery.form.js
之后即可使用
本示例为上传文件+form表单提交
使用的方法是提交地址写在form表单当中,在提交前进行检查工作,检查内容是否符合规范(是否为空),若为空则弹出提示信息,并不进行发送处理。
<%--Created by IntelliJ IDEA.User: 水之笔记Date: 2017/3/9Time: 22:02To change this template use File | Settings | File Templates.--%><%@ page contentType="text/html;charset=UTF-8" language="java" %><html><head><title>上传获奖作品</title><script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/jquery.js"></script><script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/is_null.js"></script><script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/jquery.form.js"></script><script type="text/javascript" src="${pageContext.request.contextPath}/statics/js/competition_name.js"></script><script type="text/javascript">$(document).ready(function () {$("#uploadForm").ajaxForm({resetForm: true,clearForm: true,//定义返回JSON数据,还包括xml和script格式dataType: 'json',// 在发送之前进行的操作,如果有问题,返回false即可不会进行提交beforeSend: function () {//表单提交前做表单验证if (isNull($("#name").val()) || isNull($("#year").val()) || $("#competition") == "请选择") {alert("不能为空");return false;}if ($("#file1").get(0).files[0] == null) {alert("请至少上传源文件");return false;}return true;},success: function (data) {//提交成功后调用alert(data.messageContent);window.location.reload();}});});</script></head><body><div><form method="post" enctype="multipart/form-data" id="uploadForm"action="${pageContext.request.contextPath}/background/worksInsert">作品名称:<input type="text" name="name" id="name"><br>参赛年份:<input type="text" name="year" id="year"><br>参加竞赛:<select name="competition" id="competition"><option value="请选择">请选择</option></select><br>源文件上传:<input type="file" name="file1" id="file1"><br>展示文件上传:<input type="file" name="file2" id="file2"><br>附件上传:<input type="file" name="file3" id="file3"><br><input type="submit" value="提交"></form></div></body></html>