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. Android测试(二)——adb常用命令

    连接设备: 安装应用包apk文件: adb install apk文件 卸载应用: adb uninstall 包名 将设备中的文件放到本地: adb pull 设备文件目录 本地文件目录 将本地文件 ...

  2. maven中央仓库地址(支持db2,informix等)

    maven中央仓库地址(以下设置写在pom.xml文件里): <repositories> <repository> <id>nexus</id> &l ...

  3. 树莓派 连接 JY901(MPU9250) python 代码

    先说BUG,最近要做项目需要树莓派和陀螺仪,资金充足的话肯定是买一个硬件卡尔曼滤波的传感器类似JY901模块,资金不足的就买MPU6050. 网上关于MPU6050在树莓派上的代码还能用,关于JY90 ...

  4. Web程序报错:Error instantiating servlet

    ---恢复内容开始--- web程序的前期准备工作都做好了,也就是web程序的目录都建好了,在WEB-INF文件夹下建立了classes文件夹,用于存放编好的.class文件.我想这两个类应该都在相应 ...

  5. css常用的属性

    CSS------属性值篇 display: none | block | inline(默认值) | inline-block(css2新增) | inherit none :此元素不会再显示 {注 ...

  6. angular6 http.service.ts

    import { Injectable, isDevMode } from '@angular/core'; import { HttpClient, HttpParams, HttpHeaders ...

  7. 苹果手机的SB系列(1)听不懂人话的sir

    写在前面,因手买错了(至于怎么买错了不解释)手机才买了一个苹果,价格不扉,但实在让人很不爽.记下了SB的点点. Sir听不懂人话,我让他查非洲安哥拉的时间,却屡次返回美国安哥拉洲的时间,很自恋.

  8. DocumentBuilderFactory.newInstance() 异常解决

    现象: objc[27212]: Class JavaLaunchHelper is implemented in both /Library/Java/JavaVirtualMachines/jdk ...

  9. Spring中配置使用slf4j + log4j

    本人也是查看别人博客获得的方法,详细讲解请参照 https://www.cnblogs.com/yuxiaole/p/9297266.html 下面进入正题: 1.在pom.xml中注入相关的依赖 & ...

  10. learning websocket protocol

    websocket的产生背景: 众所周知,Web应用的通信过程通常是客户端通过浏览器发出一个请求,服务器端接收请求后进行处理并返回结果给客户端,客户端浏览器将信息呈现.这种机制对于信息变化不是特别频繁 ...