form.submit(回调函数)——引用jq-form.js

最新推荐文章于 2021-06-21 09:02:37 发布

weixin_30344131

最新推荐文章于 2021-06-21 09:02:37 发布

阅读量5.3k

点赞数

文章标签： javascript java 后端 ViewUI

原文链接：http://www.cnblogs.com/blogs2014/p/5553635.html

版权

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
<title>文件上传</title>  
<script src="static/js/jquery.min.js" type="text/javascript"></script>  
<script type="text/javascript" src="static/js/jquery-form.js"></script>  
<script type="text/javascript">  
    function subimtBtn() {  
        var form = $("form[name=fileForm]");  
        var options  = {    
            url:'${pageContext.servletContext.contextPath}/servlet/imageUploadServlet',    
            type:'post',    
            success:function(data)    
            {    
                var jsondata = eval("("+data+")");  
                if(jsondata.error == "0"){  
                    var url = jsondata.url;  
                    alert(url)  
                    $("#img").attr("src",url);  
                }else{  
                    var message = jsondata.message;  
                    alert(message);  
                }  
            }    
        };    
        form.ajaxSubmit(options);  
        //$("#fileForm").submit();  
    }  
</script>  
</head>  
<body>  
            <div class="modal-body">  
                  
                <form action='${pageContext.servletContext.contextPath}/servlet/imageUploadServlet' enctype="multipart/form-data" method="post" id="fileForm" name="fileForm">  
                    <input type="file" name="filename">  
                </form>  
                  
            </div>  
  
            <div class="modal-footer">  
                <button class="btn btn-primary"  οnclick="subimtBtn();">提交</button>  
            </div>  
  
    <div>  
     <img alt="img" src="" id="img">  
    </div>  
</body>  
</html>

　　最近在项目中需要实现图片的上传，并且成功后返回图片上传保存路径，通过查找资料探索研究，实现了项目功能需求，记在这方便自己以后查阅，也为有同样需求的码友分享，功能实现比较简单，如果有好的建议和实现方法，还望多多指教。

主要将实现一下两个功能：
1、使用commons-fileupload实现文件的上传（包括图片）；
2、使用jquery-form.js实现表单提交成功的回调函数。

页面设计fileupload.jsp：

jquery.form.js 点击下载

http://files.cnblogs.com/files/blogs2014/jquery.form.rar

转载于:https://www.cnblogs.com/blogs2014/p/5553635.html

weixin_30344131

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
form.submit(回调函数)——引用jq-form.js

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dt...
复制链接

扫一扫