<%@ 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"  onclick="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 

form.submit(回调函数)——引用jq-form.js的更多相关文章

  1. form.submit 方法 并不会触发 form.onsubmit 事件

    做表单的时候发现一个奇怪的地方,总结下: form.submit 方法 并不会触发 form.onsubmit 事件,看代码: <body> <div class="con ...

  2. js 中的submit 回调函数

    1.submit.php <?php $arr = $_POST; $arr['msg']=1; //echo $_POST['uname']; echo json_encode($arr); ...

  3. 使用匿名函数在回调函数中正确访问JS循环变量

    有时候, 需要以不同的参数调用某个URL,并且在回调函数中仍然可以访问正在使用的参数, 这时候, 需要使用闭包保存当前参数, 否则, 当回调函数执行时, 之前的参数很可能早已被修改为最后一个参数了. ...

  4. asp.net form submit 在Chrome里面看Form提交

    Chrome中查看 request  form data 在Fiddler中查看

  5. JS回调函数的应用，原来这么简单！

    JS的回调函数很简单,看代码: 在a.js中 var myback = null; function load(obj){ myback = obj; } function save(){ // 后台 ...

  6. Node.js：创建应用+回调函数（阻塞/非阻塞）+事件循环

    一.创建应用 如果我们使用PHP来编写后端的代码时,需要Apache 或者 Nginx 的HTTP 服务器,并配上 mod_php5 模块和php-cgi.从这个角度看,整个"接收 HTTP ...

  7. Node js 安装+回调函数+事件

    /* 从网站 https://nodejs.org/zh-cn/ 下载 这里用的 9.4.0 版本 下载完安装 安装目录是 D:\ApacheServer\node 一路默认安装 安装后打开cmd命令 ...

  8. PHP中的回调函数和匿名函数

    html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,bi ...

  9. 什么叫CallBack函数，怎么用回调函数？

    JQuery众多常用方法中很经常会用到回调函数, 理解好js callback函数定义及用法,我们就可以利用callback函数帮我们做很多事情啦! A callback is a function ...

随机推荐

  1. Oracle数据库的创建以及远程连接（PL/SQL Developer远程连接数据库)

    dbca: 创建数据库 netca: 创建监听程序 netmgr: 配置监听服务(将数据库服务注册到监听器上) netca 与 netmgr 两步可以直接在 ORACLE_HOME/network/a ...

  2. sublimetext调试

    Package Control Sublime Text提供了绝对必要的包管理器.这是安装下面列出的所有插件和主题的最佳方式.继续,在包控制在安装插件. 进入命令面板(ctrl + shift+ p) ...

  3. bzoj 2756奇怪的游戏

    2756: [SCOI2012]奇怪的游戏 Time Limit: 40 Sec  Memory Limit: 128 MB Description Blinke 最近喜欢上一个奇怪的游戏. 这个游戏 ...

  4. 不把C作为第一门语言是个好主意么

    ----------------------------------------------------------------------------------   不把C作为第一门语言是个好主意 ...

  5. mysql设置远程访问权限

     查一下你的MYSQL用户表里, 是否允许远程连接  1.授权 mysql>grant all privileges on *.*  to  'root'@'%'  identified by  ...

  6. 调试使用windows堆程序遇到的问题

    今天测试我的api hook demo,中间有个单向链表,我对他进行遍历的时候,通过判断链表当前元素是否为NULL(即0)来进行循环控制,在cmd下正常运行,输出的是:,struct addr is ...

  7. SQL Server 2012复制教程以及复制的几种模式

    简介 SQL Server中的复制(Replication)是SQL Server高可用性的核心功能之一,在我看来,复制指的并不仅仅是一项技术,而是一些列技术的集合,包括从存储转发数据到同步数据到维护 ...

  8. tyvj1004 滑雪

    描述     trs喜欢滑雪.他来到了一个滑雪场,这个滑雪场是一个矩形,为了简便,我们用r行c列的矩阵来表示每块地形.为了得到更快的速度,滑行的路线必须向下倾斜.    例如样例中的那个矩形,可以从某 ...

  9. Flex Builder快捷键

    Flex几个最重要的快捷键 代码助手:Ctrl+Space(简体中文操作系统是Alt+/) 快速修正:Ctrl+1 单词补全:Alt+/ 打开外部Java文档:Shift+F2 显示搜索对话框:Ctr ...

  10. 【总结1】PhpStorm配置XDebug（远程）调试PHP

    配置PhpStorm调试PHP 第一步:配置 XDebug 下载安装XDebug到本地环境,打开php.ini,参考配置如下: [XDebug] zend_extension = "D:\P ...