easyui 图片上传功能详解

页面展示：

　　1、点击图片上传跳转页面携带2个参数 ID NAME=所属模块

　　　　jsp 如图：

　　js 可以上传文件和图片代码:

　　$(function() {
var falg=0;
   $list = $(\'#thelist\');
   var uploader = WebUploader.create({
       // 选完文件后，是否自动上传。
       auto : false,
       // swf文件路径
       swf : \'plugins/expand/webuploader/Uploadify.swf\',
       // 文件接收服务端。
       server : \'commAction_saveFile\',//url
       // 选择文件的按钮。可选。
       // 内部根据当前运行是创建，可能是input元素，也可能是flash.
       pick : \'#picker\',
       // 只允许选择图片文件。
       formData : {
           belongId : $(\'#belongId\').val(),
           belongMode : $(\'#belongMode\').val()
       }
   });
   uploader.on(\'fileQueued\', function(file) {
       $list.append(\'<div id="\' + file.id + \'" class="item">\'
               + \'<h4 class="info">\' + file.name + \'</h4>\'
               + \'<p class="state">等待上传...</p>\' + \'</div>\');
               var belongMode=$(\'#belongMode\').val();
               //只有是发票登记的时候只能上传图片
           if(belongMode==\'发票登记\'){
               var fileName=file.name;//获取上传图片的名称
               //判断是不是图片
               var fileType = fileName.substring(fileName.lastIndexOf(".") +1,fileName.length);
               if (fileType == \'png\'
                                               || fileType == \'jpg\'
                                               || fileType == \'jpeg\'
                                               || fileType == \'gif\'
                                               || fileType == \'bmp\'
                                               || fileType == \'raw\'){
                                               falg=0;
               }else{
                   $.messager.alert(\'错误提示\', "请选择一张图片上传", \'error\')
                   falg=1;
                   return;
                   }
               }

   })

   // 文件上传成功，给item添加成功class, 用样式标记上传成功。
   uploader.on(\'uploadSuccess\', function(file, response) {
       $(\'#\' + file.id).addClass(\'upload-state-done\');
       switch (response.flag) {
       case 0:
           closeWin();
           break;
       case 1:
           $.messager.alert(\'错误提示\', response.info, \'error\')
           break
       }
   });
   $(\'#save\').on(\'click\', function() {
   //判断是不是图片
   if(falg==1){
       return;
   }
       uploader.upload();
   });

})

根据url 到Action 代码：

最后就是将数据存在数据库。