var imgURL;
function getImgURL(node) {
try{
var file = null;
if(node.files && node.files[0] ){
file = node.files[0];
}else if(node.files && node.files.item(0)) {
file = node.files.item(0);
}
//Firefox 因安全性问题已无法直接通过input[file].value 获取完整的文件路径
try{
//Firefox7.0
imgURL = file.getAsDataURL();
//alert("//Firefox7.0"+imgUrl);
}catch(e){
//Firefox8.0以上
imgURL = window.URL.createObjectURL(file);
//alert("//Firefox8.0以上"+imgUrl);
}
}catch(e){ //这里不知道怎么处理了,如果是遨游的话会报这个异常
//支持html5的浏览器,比如高版本的firefox、chrome、ie10
if (node.files && node.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
imgURL = e.target.result;
};
reader.readAsDataURL(node.files[0]);
}
}
if(imgURL!='' || imgURL!=undefied){
$('.addImg').html('已上传');
}
creatImg(imgURL);
return imgURL;
}

function creatImg(imgUrl){ //根据指定URL创建一个Img对象
var textHtml = "<img src='"+imgUrl+"'/>";
$(".ImgGive").html(textHtml);
}

<input type="file" name="donee_img" onchange="getImgURL(this)" accept="image/*" placeholder="添加图片" class="rightInput opacity donee_img" >

对呀phone6 input加了capture="camera" 6只会调起相机 不会调起相册

图片上传js的更多相关文章

  1. 百度编辑器前后端二开图片上传Js Thinkphp tp5 ueditor

    百度编辑器图片上传Jsueditor.all.min.js 下载链接 链接:https://pan.baidu.com/s/1VNgw9ELgRRHKeCQheFkQTw 提取码:fnfi 使用方法: ...

  2. springMVC3 ckeditor3.6 图片上传 JS回调

    一.引入js文件 <script type="text/javascript" src="<%=base %>/resources/ckeditor/c ...

  3. 图片上传JS插件梳理与学习

    项目的oper端和seller端,用了两个不同插件,简单了解一下: 一.seller端:AjaxUpload.js seller端使用的是 AjaxUpload.js ,封装好的一个库.调用时传入参数 ...

  4. 头像截取 图片上传 js插件

    先看一下整体效果 页面html <div class="row"> <div class="tabs-container"> <u ...

  5. JS图片上传预览插件制作(兼容到IE6)

    其实,图片预览功能非常地常见.很意外,之前遇到上传图片的时候都不需要预览,也一直没有去实现过.现在手上的项目又需要有图片预览功能,所以就动手做了一个小插件.在此分享一下思路. 一.实现图片预览的一些方 ...

  6. 兼容好的JS图片上传预览代码

    转 : http://www.codefans.net/articles/1395.shtml 兼容好的JS图片上传预览代码 (谷歌,IE11) <html xmlns="http:/ ...

  7. ASP.Net MVC3 图片上传详解(form.js,bootstrap)

    图片上传的插件很多,但很多时候还是不能切合我们的需求,我这里给大家分享个我用一个form,file实现上传四张图片的小demo.完全是用jquery前后交互,没有用插件. 最终效果图如下: 玩过花田人 ...

  8. 关于editor网页编辑器ueditor.config.js 配置图片上传

    最近公司项目在做一个门户网站,其中新闻和简介等部分使用到了ueditor编辑器,但是上级明确指示需要图片上传这个功能,这时却发现图片上传功能不能正常使用,上传时一直报错,网上收了好几个处理办法,都说的 ...

  9. [前端 4] 使用Js实现图片上传预览

    导读:今天做图片上传预览,刚开始的做法是,先将图片上传到Nginx,然后重新加载页面才能看到这个图片.在这个过程中,用户一直都看不到自己上传的文件是什么样子.Ps:我发现我真的有强迫症了,都告诉我说不 ...

随机推荐

  1. 使用Microsoft SyncToy 文件同步/备份 自动化处理

    SyncToy 是由 微软 推出的一款免费的文件夹同步工具.百度搜索Microsoft SyncToy,官网可以直接下载 安装完成后 操作也非常简单,主要有三种模式 synchronize :在这个模 ...

  2. MQ & RPC 消息队列与RPC的区别与使用场景

    MQ:  区别:面向数据.生产者与消费者.有缓冲节点.异步.系统级/模块级通信 选型:RabbitMQ.ActiveMQ/Apollo.ZeroMQ.memcacheQ.Redis.MSMQ.kafk ...

  3. ELK原理与介绍

    为什么用到ELK: 一般我们需要进行日志分析场景:直接在日志文件中 grep.awk 就可以获得自己想要的信息.但在规模较大的场景中,此方法效率低下,面临问题包括日志量太大如何归档.文本搜索太慢怎么办 ...

  4. Spring教程笔记(2) IOC

    Ioc—Inversion of Control,即“控制反转”,不是什么技术,而是一种设计思想,一个重要的面向对象编程的法则,它能指导我们如何设计出松耦合.更优良的程序. 在Java开发中,Ioc意 ...

  5. 从零开始搭建Webpack+react框架

    1.下载node.js Node.js官网下载 , 安装: 安装成功后在控制台输入node -v 可查看当前版本: $ node -v v10.15.0 输入npm -v查看npm版本: $ npm ...

  6. eslint常用关闭校验语句

    1. 关闭段落校验 /* eslint-disable */some code some code /* eslint-enable */ 2. 关闭当前行校验 some code // eslint ...

  7. 获取上一页面url

    console.log(window.location.host); #js获取当前域名 console.log(window.location.href); #js获取当前url console.l ...

  8. 将VMware虚拟机系统镜像导入到ESXi vSphere

    原因: 公司有一个VMware虚拟机的交叉编译镜像,但主机性能不行,因此需要将镜像导入ESXi vSphere 过程: 1.将WMware虚拟机克隆; 2.将虚拟机的多个磁盘文件合并成一个;(否则vS ...

  9. js中的setTimeout和setinterval 用法说明

    setTimeout("countSecond()", 1000)://countSecond()是函数(方法) setTimeout 只执行一次函数,需要传递两个参数1是函数名, ...

  10. AngelToken揭秘区块链之四大链

    区块链,有着各种不同,与之相对应的就是内涵和功能.在区块链领域经常出现的四大链有:公有链.私有链.联盟链.许可链,这些链又分别可以为区块链干什么呢? 公有链(Public Blockchain) 是指 ...