预览图像而不上传到我的服务器

问题描述：

您好，我如何预览图像而不将其上传到asp.net C#中的服务器，并且当我看到该图像时，我应该按上载以上传到服务器.

Hello how i can preview Image without upload to my server in asp.net C# and when i see the image i should press upload to upload to server.

答

在支持HTML5的浏览器中，您可以使用

In a HTML5 capable browser you can use the FileReader object to read a file from the users hdd as a base64 encoded string. You can use this base64 representation with css to show the preview. In older browsers you will need flash or similar plugin-based code to do it.

以下是可在所有现代浏览器中使用的HTML5示例:

Here is a HTML5 example that works in all modern browsers:

<html>
<head>
<script>

var elmFileUpload = document.getElementById('file-upload');

function onFileUploadChange(e) {
    var file = e.target.files[0];
    var fr = new FileReader();
    fr.onload = onFileReaderLoad;
    fr.readAsDataURL(file);
}

function onFileReaderLoad(e) {
    var bgStyle = "url('" +e.target.result + "')";

    elmFileUpload.parentElement.style.background = bgStyle;

};

elmFileUpload.addEventListener('change',onFileUploadChange,false);
</script>
</head>
<body>
<input type="file" id="file-upload"/>
</body>
</html>

在此处查看操作中的小提琴

预览图像而不上传到我的服务器

相关推荐