Can I use any HTML or JavaScript API to get the file#39;s path in input[type=file]?(我可以使用任何 HTML 或 JavaScript API 在 input[type=file] 中获取文件的路径吗?)
问题描述
我想实现一个上传图片的功能.
I want to implement an upload image function.
上传后,我想获取文件本地路径,以便创建缩略图.但是我怎样才能得到文件路径呢?还有其他方法可以创建缩略图吗?
After uploading, I want get the file local path so I can create a thumbnail. But how can I get the file path? Is there another way to create the thumbnail?
我试过 jQuery-File-Upload 插件.
I have tried jQuery-File-Upload plugin.
推荐答案
我认为chrome支持这个,但不确定是否出于安全原因将其删除.无论如何你可以尝试使用javascrip来设置一些div的自定义宽度和高度并使用上传文件的 readAsDataURL
I think chrome supports this but not sure whether it is removed due to security reasons.Anyways you can try playing with javascrip to set custom width and height of some div and use readAsDataURL of the uploaded file
<script type="text/javascript">
function uploadFile(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#test').attr('src', e.target.result).width(100).height(100);
};
reader.readAsDataURL(input.files[0]);
}
}
</script>
<input type='file' onchange="uploadFile(this);" /> <img id="test" src="#" alt="my image" />
这篇关于我可以使用任何 HTML 或 JavaScript API 在 input[type=file] 中获取文件的路径吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:我可以使用任何 HTML 或 JavaScript API 在 input[type=


基础教程推荐
- Chart.js 在线性图表上拖动点 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- 直接将值设置为滑块 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01