http://download.csdn.net/download/licanfeng1/9895296
<script type="text/javascript"> $(function() { var imgContainer,msgDiv; window.onload = function(e){ imgContainer = document.getElementById('container'); msgDiv = document.getElementById('msg'); imgContainer.ondragover = function(e){ e.preventDefault(); } imgContainer.ondrop = function(e){ e.preventDefault(); var f = e.dataTransfer.files[0]; var fileReader = new FileReader(); fileReader.readAsDataURL(f); fileReader.onloadend=function(e){ $.post("upload",{'img':e.target.result},function(response){ $("input[name='avatar']").val(response.path); },'json'); imgContainer.innerHTML = "<img src=\""+fileReader.result+"\">"; } } } $(".photo").mouseover(function() { $(".photo a").css("display","block"); $("body").on("click",".photo a",function () { $(".container img").remove(); }); }); $(".photo").mouseout(function() { $(".photo a").css("display","none"); }); $("#btnPrint").click(function(){ $("#modal_form").printArea(); }); $("#container").on("click",function () { $("input[name='avatar_file']").click(); }) /*$("input[name='avatar_file']").on("change",function () { var f = $("input[name='avatar_file']"); var fileReader = new FileReader(); //var a = fileReader.readAsDataURL(f); console.log(f); })*/ }); function openFile(e) { var input = e.target; var reader = new FileReader(); var imgContainer = document.getElementById('container'); reader.onload = function () { $.post("upload",{'img':reader.result},function(response){ $("input[name='avatar']").val(response.path); },'json'); imgContainer.innerHTML = "<img src=\""+reader.result+"\">"; }; reader.readAsDataURL(input.files[0]); }; </script> <a href="javascript:void(0);">x</a> <p class="text2">请点击区域上传或将图片拖拽至此区域!</p> <div class="container" id="container"> <?php if($avatar){ ?> <img src="<?=$avatar?>" > <?php } ?> <div id="msg"><img src="images/img_log.jpg"></div> </div> php后端 public function upload(){ $imgdata = substr($_POST['img'],strpos($_POST['img'],",") + 1); $decodedData = base64_decode($imgdata); if($decodedData){ $ext = "jpg"; $root_path = "D:/"; $upload_path = "upload/avatar/"; $filename = $upload_path.uniqid().".".$ext; $savename = $root_path.$filename; if(file_put_contents($savename,$decodedData)) exit(json_encode(array("path"=>$filename))); } /*if($tmp_name = $_FILES['userfile']['tmp_name']){ $ext = array_pop(explode('.', $_FILES['userfile']['name'])); if(move_uploaded_file($tmp_name,$savename)) exit(json_encode(array("path"=>$filename))); }*/ }
