关闭

上传图片即时显示

标签: 上传图片即时显示jquery
431人阅读 评论(0) 收藏 举报
分类:

//图片即时显示

/**
 * 获取图片路径
 */
function geturl(file) {
    var url = null;
    if (window.createObjectURL != undefined) {
        url = window.createObjectURL(file);
    } else if (window.URL != undefined) {
        url = window.URL.createObjectURL(file);
    } else if (window.webkitURL != undefined) {
        url = window.webkitURL.createObjectURL(file);
    }
    return url;
}


$(function(){
$("#articleImage").change(function(){
var image = $("#articleImage")[0];
var url = geturl(image.files[0]);

if(url == null){
$("#showImage").hide();
}else{
$("#showImage").show();
$("#showImage").attr("src",url);
}
});

});


<label>图片:</label>
<input type="file" id="articleImage" name="articleImage" >

<img id="showImage"  src="">

0
0
查看评论

上传图片 即时显示

jsp页面中: 上传预览图片: $(document).ready(function() { //建议在#imgDiv的父元素上加个overflow:hid...
  • hongmin118
  • hongmin118
  • 2017-10-17 17:43
  • 52

js实现图片上传并即时显示

js实现图片上传并即时常显示
  • s371795639
  • s371795639
  • 2016-12-12 16:13
  • 3244

jsp中实现上传图片即时显示效果功能

function setImagePreview() { var docObj=document.getElementById("doc"); var imgObjPreview=document.getElementById("preview"); if(d...
  • sinat_34803353
  • sinat_34803353
  • 2016-11-21 02:09
  • 365

上传图片,即时显示缩略图

上传图片,即时显示缩略图 IE,FF中可能运行通过!! 即时显示缩略图 <!-- var allowExt = [jpg, gif, bmp, png, jpeg]; var preivew = function(file, container){ try{...
  • yjlwl1213
  • yjlwl1213
  • 2009-11-13 09:36
  • 4314

上传图片即时显示

//上传图片即时显示 function previewImage(imgFile) {  var pattern1 = /(\.*.jpg$)/; var pattern2 = /(\.*.JPG$)/; if($("#trueFile").val() != n...
  • A632189007
  • A632189007
  • 2015-05-12 16:45
  • 456

jQuery 上传图片并即时显示

效果 页面 上传图片预览功能 <!-- --> $(function(){ $("#pic").change(function(){ if($.browser.msie){ $("#img0...
  • A9925
  • A9925
  • 2015-06-30 11:05
  • 2118

HTML上传即时显示图片

https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader 可先看看这篇文章了解一下FileReade 上代码 ...
  • lihaitao_1
  • lihaitao_1
  • 2015-09-04 14:56
  • 9063

laravel框架上传图片实时预览

在laravel框架中上传图片并实时预览,其实并没有那么难,下面给大家展示一下;
  • q459691431
  • q459691431
  • 2017-07-07 16:39
  • 924

JSP页面,实现上传图片即时显示效果

function setImagePreview() { var docObj = document.getElementById("doc"); var imgObjPreview = document.getElementById("preview"...
  • catenl
  • catenl
  • 2015-12-12 20:22
  • 1503

使用h5做上传图片的即时显示

使用FileReader的readAsDataURL可以将文件读取为base64编码的字符串,使用img标签可以展示为base64编码的图片。 /** * */ function (img){  var reader = new FileReader(); reader.onloadend...
  • huangxiao1988819
  • huangxiao1988819
  • 2015-11-12 09:18
  • 1792
    个人资料
    • 访问:53509次
    • 积分:1625
    • 等级:
    • 排名:千里之外
    • 原创:103篇
    • 转载:20篇
    • 译文:0篇
    • 评论:10条
    文章分类
    最新评论