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. 自动生成CHANGELOG.md

    $ npm install -g conventional-changelog-cli $ cd my-project $ conventional-changelog -p angular -i C ...

  2. (转)理解CPU steal time

    转自:https://www.cnblogs.com/menkeyi/p/6732020.html Netflix 很关注CPU的Steal Time.他们的策略是:如果是当前虚拟机的Steal Ti ...

  3. 撸一个小型PHP框架

    项目地址:https://packagist.org/packages/cshaptx4869/frame # 开发中... ## 20190410 注解路由 ## 20190411 依赖注入 容器I ...

  4. 使用session统计在线人数

    效果图如下 这里是Chrome浏览器新登录一个用户 代码展示 package com.test.Util; import java.util.ArrayList; import javax.servl ...

  5. angular 引入编辑器遇到的各种问题。。。

    1.项目中找不到angular-cli.json,也找不到angular.json 2. 3.

  6. http请求requestUtils

    import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; import ...

  7. ASCII与HEX对照转换表

    最近在研究ESC/POS 打印指令,时不时的就用到 ASCII和Hex的相互转换 ASCII HEX ASCII HEX ASCII HEX ASCII HEX NUL 00 DEL 10 Space ...

  8. sqlserver 数据库关于存储xml字段里内容的查找与替换

    1.传送门 :   http://www.cnblogs.com/GuoPeng/archive/2009/12/11/1621527.html 2.复制原帖的修改部分: 修改:@xml . modi ...

  9. 微信浏览器无法跳转到apk下载链接 微信屏蔽了我的APP下载链接如何处理

    由于微信的限制,应用文件在内置浏览器中下载全部被屏蔽掉,造成很多人用微信扫描二维码下载时,界面显示一片空白,容易误导以为在下载呢 <!DOCTYPE html><html>&l ...

  10. [Err] 1093 - You can't specify target table 'master_data' for update in FROM clause

    delete from master_data where category_id not in (select category_id from master_data a, bc_category ...