ajax上传图片

<li><label>图片</label>
                    <div class="upload_img_content">
                        <form action="/Merch/Shop/Upload" id="form1" class="uploadimg" role="form" method="post" enctype="multipart/form-data" >
                           <input name="" type="button" class="btn"  id="upimage" value="上传图片" />
                           <input type="file" name="pic" id="upfile" class="btn btn-file" />
                        </form>
                        <ul class="imglist">
                        </ul>
                    </div>
                </li>

<li><label></label><input name="" onclick="doSumbit()" type="submit" class="btn" value="添加"/></li>

上传图片的js写法：

<script>
        function showResponse(data) {
            switch (data) {
                case "1":{
                    alert("图片不存在");
                    break;
                }
                case "2":{
                    alert("图片文件过大");
                    break;
                }
                case "3":{
                    alert("图片格式不正确");
                    break;
                }
                case "4":{
                    alert("移动图片出错");
                    break;
                }
                default:{
                    var shopUrl = imageUrl+data;
                    var append = "<li class="selected"><span><img src=""+shopUrl+""><input id="imageTitle" type="text" style="width:166px;" class="dfinput" value=""  placeholder="请输入图片名称(可为空)"/></span><i class="img_del"></i></li>";
                    $(".imglist").append(append);
                    break;
                }
            };
        }
        $(function(){
            $(".btn-file").change(function(){
                if($(".imglist li").length < 5){
                    $(this).parent().ajaxSubmit({
                        success: function(data) {  
                            showResponse(data);
                        },error: function(msg) {
                            alert("error");
                        }
                    });
		}else{
                    alert("只能上传五张照片");
		}
            });
            
            // 删除图片操作
            $(".imglist").delegate("li","mouSEOver",function () {
                $(this).children("i.img_del").show();
            }).delegate("li","mouSEOut",function () {
                $(this).children("i.img_del").hide();
            }).delegate("li i.img_del","click",function () {
                $(this).parent().remove();
            });
        });
        </script>

PHP shop.Upload 方法

public function Upload() {
        $uptypes = array('image/jpg','image/jpeg','image/png','image/pjpeg','image/gif','image/bmp','image/x-icon','image/x-png');
        $maxSize = 2000000;     //上传文件大小限制 
        $file = $_FILES["pic"];
        if (!is_uploaded_file($file['tmp_name'])) { //判断图片文件是否存在
            return 1;
        }
        if ($file['size'] > $maxSize) {  //判断图片大小是否大于$max_size
            return 2;
        }
        if (!in_array($file['type'],$uptypes)) {  //判断图片文件的格式
            return 3;
        }
        $info = pathinfo($file["name"]);
        $icon = date("YmdHis") . uniqid() .".".$info["extension"];
        Video::mkFolder(Video::uploadPath()."shop");
        $filename = Video::uploadPath()."shop/".$icon; //图片的路径
        if (!move_uploaded_file($file['tmp_name'],$filename)) {
            return 4;
        }
        return $icon;
    }

<script type="text/javascript">
            function doSumbit() {
                var name = $("#name").val();
                var desc = $("#desc").val();
                var gwList = $("#gwList").val();
                var url  = $("#url").val();
                var li = $(".imglist li");
                if (name == "") {
                    alert("账号名称不能为空");
                    return;
                }
                var imgArr = [];
                var leng  = [];
                for(var i = 0; i < li.length; i++) {
                    var src = li.eq(i).children().find("img").attr("src");
                    imgArr.push({imgSrc: src.substring(src.lastIndexOf('/')+1),imgTitle: li.eq(i).children().find("input").val()});
                    leng[i] = imgArr;
                    imgArr = [];
                }
                var imageList = JSON.stringify(leng);
                $.ajax({
                    type: "post",data: {
                        name: name,desc: desc,gwList: gwList,pic: imageList,url: url
                    },dataType: "json",url: "<?php echo FrameworkNetUrl::canvas("Merch","Shop.doAdd")?>",success: function (data) {
                        alert(data["message"]);
                        window.location.href=data["location"];
                    },error: function(){
                        alert("提交失败");
                    },});
            }
        </script>

doAdd方法：

public function doAdd() {
        $name = trim($this->request->get("name"));
        $desc = $this->request->get("desc");
        $gwList = $this->request->get("gwList");
        $pic = $this->request->get("pic");
        $url = $this->request->get("url");
        if ($name== "") {
            echo json_encode(array("status" => 0,"message" => "商铺名称不能为空","location" => FrameworkNetUrl::canvas("Merch","Shop.add")));
            return;
        }
        if ($url== "") {
            echo json_encode(array("status" => 0,"message" => "商铺地址不能为空","Shop.add")));
            return;
        }
        $sessionArray = Session::get();
        $businessId = $sessionArray["id"];
        $info = array(
            "businessId" => $businessId,"name" => $name,"desc" => $desc,"pic" => $pic,"url" => $url,"gwList" => $gwList,"created" => time()
        );
        Shop::add($info);
        echo json_encode(array("status" => 1,"message" => "添加商户成功","Shop.run")));
    }

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!