页面中显示图片

原创 2016年06月02日 01:20:25

解决问题:图片上传至服务器后如何显示在此不再赘述,这里讲的是使用标签选择图片后,即可以在页面上显示的问题。


JS代码:

<script type="text/javascript">
//获取input[file]图片的url Important
function getFileUrl(fileId) { 
    var url; 
    var file = document.getElementById(fileId);
    var agent = navigator.userAgent;
    if (agent.indexOf("MSIE")>=1) {
    url = file.value; 
    } else if(agent.indexOf("Firefox")>0) { 
    url = window.URL.createObjectURL(file.files.item(0)); 
    } else if(agent.indexOf("Chrome")>0) {
    url = window.URL.createObjectURL(file.files.item(0)); 
    } 
    return url; 
} 
//给  input type="file"  绑定click事件
function fileClick(){
$("#items_pic").click();
}
//显示图片
function showImg(){
    var file = $("#items_pic");
    if(file.value==''){
        //设置默认图片
    $("#myimg").attr();
    }else{
    $("#myimg").attr("src",getFileUrl("items_pic"));
    }
}
</script>

图片显示区域:

<div style="margin-left: 15px">
                <label for="tzggTime" class="col-lg-2 control-label">照片上传</label>
                    <div class="form-group">
                    <input type="button" value="选择文件" id="mybutton" class="mybtn"  onclick="fileClick()" />
                    <input type="file" name="items_pic"  id="items_pic" onchange="showImg();" style="display:none;" />
                    </div>  
                    <div>
                        <img id="myimg" src="" style="height: 128px;width: 100px;"/>
                    </div>
</div>
版权声明:本文为博主原创文章,未经博主允许不得转载。

图片淡入淡出页面显示

  • 2009年11月21日 11:52
  • 2.16MB
  • 下载

一步一步教你用PHP+MySql搭建网站 No.2 图片显示和Page页面

接着上一章节的看,我们现在的程序有了第一个主页面,但是我们会发现几个问题,一个是主页上的图片没法显示,二是点击read more ... 之后的链接没有内容 这两个页面的入口分别是下图里面的两个框出...

html5实现页面的显示本地图片

  • 2013年01月18日 14:50
  • 1021B
  • 下载

JSP页面使用文件上传图片并且回传显示的注意事项

***要正常实现文件上传以下步骤应该全部考虑到: *1.html中 表示文件上传控件 *2.form的enctype="multipart/form-data" *3.在Servlet类前加上 ...

labview串口、图片显示、文件夹/文件(txt,csv)操作、aceess数据库、页面跳转、全局变量

labview串口通信、显示图片、文件操作、数据库等

美女图片闪烁页面显示

  • 2009年11月21日 11:45
  • 2.16MB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:页面中显示图片
举报原因:
原因补充:

(最多只允许输入30个字)