文件上传并展示上传文件
- 黄舟原创
- 2017-02-18 13:17:291386浏览
1、问题背景
利用文件上传组件file，上传文件后并显示文件（图片）
2、实现源码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>文件上传并展示文件路径</title>
<script type="text/javascript" src="../js/jquery-1.12.3.js" ></script>
<script>
$(document).ready(function(){
$("#fileUpload").off().on("change",function(){
var fileUpload = $(this).val();
var proUrl = window.location.protocol;
var pageUrl = window.location.host;
var path = proUrl + "//" +pageUrl + "/AngularJS/pages/";
$("#uploadImg").attr("src",path+fileUpload);
console.info(path+fileUpload);
});
});
</script>
</head>
<body>
<p>
<input type="file" id="fileUpload" name="upload" /><br><br>
<img id="uploadImg" style="width: 200px; height: 200px;">
</p>
</body>
</html>
3、实现结果
以上就是文件上传并展示上传文件的内容，更多相关内容请关注PHP中文网（www.php.cn）！
声明：
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
上一篇：AngularJS之ng-if指令下一篇：AngularJS之表格