php产品细节图多图上传示例代码无刷新

前台文件代码

upload.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>产品细节图多图上传示例代码 无刷新</title>
<style>
.filepath{width:300px;}
.uploadinfo{color:#009900;}
</style>
<script language="javascript" type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
function process(v){  
    if(v=="inform"){  
        document.addimgform.action="do_upload.php"; 
        $("form").attr("target","fileUp"); 
    }
    document.addimgform.submit();  
} 

 
$(document).ready(function(){

////////////////////
$('#add_gallery').click(function(){
$("#gallery").append('<div class="addinput"><a href="javascript:;" class="remove_gallery">[-]</a> <input name="filepath[]" id="textpath" class="textpath" type="text" value="" /> <input type="file" name="img_gallery[]" id="img_gallery" class="filepath" /> <span class="spanimg"></span></div>');
});

////////////////////
$(document).on("click",".remove_gallery",function(){$(this).parent(".addinput").remove();});

////////////////////
$(document).on("change",".filepath",function(){
var route=$(this).val();
$(this).parents(".addinput").find(".textpath").val(route);
});

////////////////////
$(document).on("click",".delimg",function(){
    id = $(this).attr("rel");
    url = $(this).attr("rev");
    path = $(this).attr("rep");
    name = $(this).parents(".addinput").find(".filepath").val();
    $.post
        (
            "do_upload.php",
            {imgid:id,imgurl:url,imgpath:path},
            function(){
                alert('图片 '+name+' 已删除！');
            },
            "html"
        );
    $(this).parents(".addinput").remove();
});

////////////////////

});

</script>

</head>

<body>

<!--<form id="addimgform" name="addimgform" target="fileUp" enctype="multipart/form-data" action="do_upload.php" method="post">-->
<form id="addimgform" name="addimgform" enctype="multipart/form-data" action="product.php" method="post">
<fieldset>
<legend>产品上传</legend>

产品名：<input name="proname" type="text" value="" /><br /><br />
价&nbsp;&nbsp;格：<input name="price" type="text" value="" /><br /><br />



<fieldset>
<legend>图片上传</legend>

<div id="gallery">
<div class="addinput"><a href="javascript:;" class="remove_gallery">[-]</a> <input name="filepath[]" id="textpath" class="textpath" type="text" value="" /> <input type="file"  name="img_gallery[]" id="img_gallery" class="filepath" /> <span class="spanimg"></span></div>
</div>
<a href="javascript:;" id="add_gallery">[+]</a>
<input name="upimg" type="submit" value="上传" id="upimg" onclick="process('inform')">
<span class="uploadinfo"></span>
</fieldset>
<iframe style="border:0px;" width="0px" height="0px" name="fileUp"></iframe>

<script>
function notice_success(i,url,path,info){
    $("#gallery .textpath").eq(i).val(url);
    $("#gallery .spanimg").eq(i).html(info+'<img src="'+url+'" style="60px; height:60px;" align="absmiddle" /> <a class="delimg" href="javascript:;" rel="'+i+'" rev="'+url+'" rep="'+path+'">删除</a> ');
}
function notice_failure(info){
    $("#gallery .spanimg").eq(i).html(info);
} 
</script>

<input name="submit" type="submit" value="提交" id="submit">


</fieldset>

</form>
</body>
</html>

后台文件代码

do_upload.php

<?php 

  $basedir = dirname(__FILE__).'/'.date('Y-m-d');    
  $new_folder = str_replace('\','/',$basedir);
  if(file_exists($new_folder)){
      //echo 'exists';
  }else{
      mkdir($new_folder, 0777);
  }
?>

<?php

if (isset($_POST['imgid']) && isset($_POST['imgurl']) && isset($_POST['imgpath'])){
    if(file_exists($_POST['imgpath'])){
        $thepath = str_replace('/','\',$_POST['imgpath']);
        unlink($thepath);
    }else{
        echo '未找到相关文件';
    }
}

if(!empty($_FILES)){
    for ($i=0;$i<count($_FILES['img_gallery']['tmp_name']);$i++){
        //$file_name = iconv('utf-8', 'gb2312', $_FILES['img_gallery']['name']);//在utf8编码下可以防止中文乱码
        $upfile = $new_folder."/".$_FILES['img_gallery']['name'][$i];//此处路径换成你的
        $imgpath = 'http://'.$_SERVER['SERVER_NAME'].'/images/'.date('Y-m-d').'/'.$_FILES['img_gallery']['name'][$i];//上传后的图片url
        if(move_uploaded_file($_FILES['img_gallery']['tmp_name'][$i],$upfile)){
            //echo "第".($i+1)."张图片上传成功<br>";
            $info = "第".($i+1)."张图片上传成功！ ";
            //此处进行数据库操作
            ?>
            <script>parent.notice_success('<?php echo $i;?>','<?php echo $imgpath;?>','<?php echo $upfile;?>','<?php echo $info;?>');</script>
            <?php
            @unlink($_FILES["img_gallery"]["tmp_name"][$i]);
        }
        else{
            $info = "第".($i+1)."张图片上传不成功！ ";
            ?>
            <script>parent.notice_failure('<?php echo $info;?>');</script>
            <?php
        }
    }
}
?>

打完收工！

转载请注明出处！小鱼阁工作室 -专注zencart建站，织梦企业建站，ecshop商城，二次开发，产品采集，模板修改！技术QQ 631992791

php产品细节图多图上传示例代码 无刷新

php产品细节图多图上传示例代码无刷新