firefox js服务器上怎么显示图片的绝对路径,js兼容火狐显示上传图片预览效果的方法...

本文实例讲述了js兼容火狐显示上传图片预览效果的方法。分享给大家供大家参考。具体实现方法如下：

Image preview example

div {width:100px;height:100px;border: 1px #A3BFE7 solid;}

img {width:atuo;height:atuo;}

function viewPic() {

var oFReader = new FileReader();

oFReader.onload = function(e) {

document.getElementById("uploadPreview").src = e.target.result;

}

if (document.getElementById("uploadImage").files.length === 0) {

return;

}

var oFile = document.getElementById("uploadImage").files[0];

oFReader.readAsDataURL(oFile);

}

οnchange='viewPic();'/>

运行效果如下图所示：

希望本文所述对大家的javascript程序设计有所帮助。

总结

如果觉得编程之家网站内容还不错，欢迎将编程之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。

firefox js服务器上怎么显示图片的绝对路径,js兼容火狐显示上传图片预览效果的方法...相关推荐

上传图片显示扫描效果html5,JS+HTML5实现上传图片预览效果完整实例【测试可用】...
本文实例讲述了JS+HTML5实现上传图片预览效果.分享给大家供大家参考,具体如下: 在项目中遇到用input标签file类型的文件上传,想实在上传之前进行图片的预览功能:之前的做的一个解决方案是文件 ...
pdf.js在h5端访问图片服务器地址携带token防盗链无法读取问题,兼容安卓ios在线预览
1.实现方法为前端代码和后台Java代码结合 1.后端代码 @Controller @RequestMapping("/productController") public cla ...
微信小程序图片放大预览效果的实现
效果预览效果图有点快,但是可以大致看出来效果了.我再给大家描述下吧一个页面有3张图片,点击其中任意一张都可以放大预览.然后在预览的时候,左右滑动,还可以看另外两张图片. 话不多说,直接上代码 1, ...
微信小程序图片放大预览效果的实现，轮播图点击放大预览
近期很多刚学习小程序的同学,想做哪种图片点击放大,然后可以左右滑动预览的效果.我也特意去研究下,发现直接用微信程序自己的api就可以很方便的实现.今天就来教大家如何实现小程序图片点击放大的效果. 老规 ...
JS兼容各个浏览器的本地图片上传即时预览效果
JS兼容各个浏览器的本地图片上传即时预览效果很早以前在工作曾经碰到这么一个需求,当时也是纠结了很久,也是google了很久,没有碰到合适的demo,今天特意研究了下这方面的的问题,所以也就做了个简 ...
JavaScript 图片上传预览效果
图片上传预览是一种在图片上传之前对图片进行本地预览的技术. 使用户选择图片后能立即查看图片,而不需上传服务器,提高用户体验. 但随着浏览器安全性的提高,要实现图片上传预览也越来越困难. 不过群众的智慧 ...
anguarjs 上传图片预览_前端图片上传那些事儿
本文转自:掘金作者:chess 前言本文讲的图片上传,主要是针对上传头像的.大家都知道,上传头像一般都会分成以下 4 个步骤: 选择图片 -> 预览图片 -> 裁剪图片 -> 上 ...
form 表单 + HTML5(FileReader) +iframe 实现无刷新图片上传+图片预览效果
作为一个初入前端的菜鸟,最近因为一个无刷新上传图片问题走了很多弯路,所以在这里给大家分享一下,不足之处希望谅解.无刷新上传图片一般有两种方式,一种是 form 表单+iframe ,还有一种是 aja ...
php 上传图片预览多张,uploadify插件实现多个图片上传并预览
使用uploadify插件可方便实现图片上传功能.兼容ie6.ie7. 上传成功之后使用插件的回调函数读取json数据,根据url实现图片预览. 效果图: 点击浏览文件上传图片,图片依次在右侧显示预览 ...

firefox js服务器上怎么显示图片的绝对路径,js兼容火狐显示上传图片预览效果的方法...

firefox js服务器上怎么显示图片的绝对路径,js兼容火狐显示上传图片预览效果的方法...相关推荐

最新文章

热门文章