HTML直接上传图片

我有一个页面，将允许用户上传他们的图片，将作为他们的个人资料图片。我有这样的代码：HTML直接上传图片

<form method = "post" action = "" enctype="multipart/form-data"> 
    <input type = "hidden" name = "size" value = "1000000"> 
    <input type = "file" name = "image"> 
    <input type = "submit" name = "upload" value = "Upload Image"> 
</form>

我的PHP：

if(isset($_POST['upload'])) { 
    $target = "profileimgs/".$key.basename($_FILES['image']['name']); 

    $image = $key.basename($_FILES['image']['name']); 


    $sql = "UPDATE users SET img = '$image' WHERE idnumber = $idnumber"; 
    mysqli_query($con,$sql); 

    if(move_uploaded_file($_FILES['image']['tmp_name'], $target)) { 
     header("Location:home.php"); 
    } else { 
     header("Location:error_uploading.php"); 
    } 
}

通过选择图片，将显示唯一的预览图片的文件名。我想在选择图像后立即添加他们所选图像的“预览”。就像在Facebook上上传个人资料图片时一样 - 您可以从计算机上选择一张图片，然后点击select picture它会自动将图片上传到网页，并为您提供该图片的预览，而不必点击这么多按钮。

我能做些什么来实现这个目标吗？

来源

2017-04-01 Dranreb

是的，有。你对这方面有什么想法？我看到一个很好的上传代码，但不是预览（你的问题是关于什么）。一个简单的搜索会让你很远。如果你有任何问题，你可以在这里问问他们。 – Nytrix

解决在这里：http://stackoverflow.com/questions/4459379/preview-an-image-before-it-is-uploaded – Hossam

如果需求是上传后预览图像，你可以发送文件到客户端从'php'而不是文件名，将'iframe'元素设置为'form'的'target'' http://stackoverflow.com/questions/168455/how-do-you-post-to-an-iframe/ – guest271314

<form id="form1" runat="server"> 
    <input type='file' id="imgInp" /> 
    <img id="blah" src="#" alt="your image" /> 
</form> 


<script type="text/javascript"> 
function readURL(input) 
{ 
     if (input.files && input.files[0]) { 
      var reader = new FileReader(); 

      reader.onload = function (e) { 
       $('#blah').attr('src', e.target.result); 
      } 

      reader.readAsDataURL(input.files[0]); 
     } 
} 

$("#imgInp").change(function(){ 
    readURL(this); 
}); 
</script> 
It will show instead image using javascript base encode. your php code work as well as.

来源

2017-04-01 18:27:49

可以使用jasny插件的图片上传窗口小部件，有一个美丽的上传

来源

2017-04-01 19:02:10 Zakaria

HTML直接上传图片

回答

相关问题