jquery图片上传功能

关于jquery图片上传功能呢，我引入了

成都创新互联从2013年创立，是专业互联网技术服务公司，拥有项目成都做网站、网站建设网站策划，项目实施与项目整合能力。我们以让每一个梦想脱颖而出为使命，1280元赛罕做网站,已为上家服务,为赛罕各地企业和个人服务,联系电话:18982081108

jquery.min.js
jquery-1.8.3.min.js
jquery.ui.widget.js
jquery.iframe-transport.js
jquery.fileupload.js

上传图片的代码：

图片上传成功之后，可以选择删除！里面的变量就是我从数据库查出来的，数据库当然存放的是图片的路径了！

这是单张图片上传的html代码

    产品相册
     
    
        
        
        " name="goodsimg" />
        " 
         id="goodsimg" />
        
            
        
    

这是多张图片上传的html代码

    企业证书
     
    
        
        
        " name="Certiimg" />
        
            
                    
"  id="Certificateimg" />
                        
                            
                        
                    
                    
        
    

上传的js代码：

  $(function (){
        var goodsimg = $("#goodsimg").attr("src");
        //单张图片显示
        if(goodsimg!=""){
               $("#goodsimg").css("display","block");
               $(".delgoodsimg").css("display","block");
        }
        //单张图片删除
        $(".delgoodsimg").click(function (){
              $("input[name='goodsimg']").val("");
              $("#goodsimg").css("display","none").attr("src","");
              $(this).css("display","none");
        });
        //多条副
        $(".delCertificateimg").live('click',function(){
            var delindex = $(this).parents("li").length;
            var Certiimgval = $("input[name='Certiimg']").val();
            var Certiimgarr = Certiimgval.split("|");
            Certiimgarr.pop();
            if(Certiimgarr.length == 0){
                $("input[name='Certiimg']").val("");
            }else{
                Certiimgval = Certiimgarr.join("|");
                $("input[name='Certiimg']").val(Certiimgval);
            }
            $(this).parents("li").remove();
        });

        //jquery图片上传
        $('#fileUpload').fileupload({
            dataType: 'json',
            done: function (e, data)
            {
                if(data.result.flag == 1 && data.result.img != "")
                {
                    /*uploadPicCallback(data.result);*/
                    $("input[name='goodsimg']").val(data.result.img);
                    $("#goodsimg").css("display","block").attr("src",data.result.img);
                    $(".delgoodsimg").css("display","block");
                }
                else
                {
                    console.log("err");
                }
            },
            progressall: function (e, data)
            {
                var progress = parseInt(data.loaded / data.total * 100);
                $('#uploadPercent').text("加载完成："+progress+"%");

            }
        });

      //多图上传
    $('#CertifileUpload').fileupload({
        dataType: 'json',
        done: function (e, data)
        {
            if(data.result.flag == 1 && data.result.img != "")
            {
                if($(".Certidom").find("li").length == 2){
                    alert("上传图片多于2张，请删除一张图片后重新上传");
                    return false;
                }
                var certidom = '
';
                $(".Certidom").append(certidom);
                /*uploadPicCallback(data.result);*/
                var Certiimgval = $("input[name='Certiimg']").val();
                if(Certiimgval == ""){
                    $("input[name='Certiimg']").val(data.result.img);
                }else{
                    $("input[name='Certiimg']").val(Certiimgval+"|"+data.result.img);
                }
            }
            else
            {
                console.log("err");
            }
        },
        progressall: function (e, data)
        {
            var progress = parseInt(data.loaded / data.total * 100);
            $('#uploadPercent').text("加载完成："+progress+"%");

        }
    });

    });



backend_upload_photo.php文件就是上传图片后台代码处理图片的地址
结合上传图片的地方来写此部分
$fileExtArr = explode(".",$_FILES['_goodsFile']['name']);
$fileExt = ".".$fileExtArr[1];
//图片存放地址进行名字随机给处理
$path='/backend/actions/upload/'.time().md5($_FILES['_goodsFile']['name'].rand()).$fileExt;
move_uploaded_file($_FILES['_goodsFile']['tmp_name'],$_SERVER['DOCUMENT_ROOT'].$path);
echo json_encode(array("flag"=>1,"img"=>"..".$path));

网页题目：jquery图片上传功能
转载注明：http://mswzjz.cn/article/jgeheo.html