javascript图片上传格式验证,缩略图预览呈现,兼容IE,FIREFOX

来源:网络 责任编辑:栏目编辑 发表时间:2013-07-01 04:09 点击:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript">
        var picPath;
        var image;
        var box;

        //只要调用这个方法就可以了,参数(this,这里为显示的位置)
        function LoadImage(ele, show_pos_obj) {
            picPath = GetImgPath(ele);
            if (picPath != "" && picPath != null) {
                image = new Image();
                image.src = picPath;
                box = GetObj(show_pos_obj);
                box.innerHTML = "<span style='color:gray;font-size:11px'>加载中...</span>";
                setTimeout(ImgView, 1000);
            } else {
                return false;
            }
        }

        //呈现图片视图
        function ImgView() {
            if (image.width == 0 || image.height == 0) {
                settimeout(ImgView, 1000);
            } else {
                if (box != null) {
                    var imgWidth = (image.width >= box.offsetWidth) ? box.offsetWidth : image.width;
                    var imgHeight = (image.height >= box.offsetHeight) ? box.offsetHeight : image.height;
                    var alt = "图片实际尺寸为:" + image.width + "&nbsp;*&nbsp;" + image.height;
                    box.innerHTML = "<img width='" + imgWidth + "' height='" + imgHeight + "' id='apic' src='" + picPath + "' onload='DrawImage(this," + box.offsetWidth + "," + box.offsetHeight + ")' title=" + alt + " />";
                }
            }
        }

        //获取IE,FF下图片的路径

    相关新闻>>

      发表评论
      请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
      用户名: 验证码:点击我更换图片
      最新评论 更多>>

      推荐热点

      • Gb2312转utf-8编码的方法(vbs+js)
      • 如何使用Ajax技术开发Web应用程序(1)
      • js跳转路径问题
      • JavaScript模仿桌面窗口
      • 用js检测两个线段是否相交
      • 运用JavaScript构建你的第一个Metro式应用程序(on Windows
      • 我知道的JavaScript -- 设计模式(桥接)应用之 – 验证器
      • 我是如何去了解jquery的(六),案例之幻灯片轮换
      • Jquery封装幻灯片效果
      网站首页 - 友情链接 - 网站地图 - TAG标签 - RSS订阅 - 内容搜索
      Copyright © 2008-2015 计算机技术学习交流网. 版权所有

      豫ICP备11007008号-1