Javascript中的图像大小 - IE9

时间:2013-06-06 04:18:55

标签: image upload internet-explorer-9

我想在IE9中获取我的图像大小。我成功地做到了(试过jpg)。当我尝试加载宽度低于高度的图像时,完全没有问题。但是当我尝试上传宽度高于高度的图像时,我看到输出“vh:”,“vw:”的行返回零。

为什么在尝试加载宽度为>的图像(通过我的代码)时出现问题?高度? 感谢。

这是我的代码(适用于IE9的工作 - 这就是我要查看的内容)。

<!doctype html>
<html>
  <head>
    <!-- <meta content="text/html; charset=UTF-8" http-equiv="Content-Type" /> -->
    <link href='http://fonts.googleapis.com/css?family=PT+Sans:400italic' rel='stylesheet' type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=PT+Sans:700' rel='stylesheet' type='text/css'>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
    <title>Image preview example</title>
    <script type="text/javascript">
      var loadImageFile = (function () {
        var v=new Image();
        if (navigator.appName === "Microsoft Internet Explorer") {
          return function () {
            alert("file." + document.getElementById("id_filepic").value);
            $("#id_image").css("filter", "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)");
            //$("#id_image").attr("src", document.getElementById("id_filepic").value);
            //v.src = document.getElementById("id_filepic").value;
            v.src = $("#id_filepic").val();
            alert("vw:" + v.width);
            alert("vh:" + v.height);
            $("#id_image").width(v.width);
            $("#id_image").height(v.height);
            document.getElementById("id_image").filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = document.getElementById("id_filepic").value;
            alert("w final:" + $("#id_image").width());
            alert("h final:" + $("#id_image").height());
          }
        }
      })();
    </script>
    <style type="text/css"></style>
  </head>
  <body>
    <form name="uploadForm">
      <p><input id="id_filepic" type="file" name="myPhoto" onchange="loadImageFile();" /><br />
    </form>
    <image id="id_image" src="" onmousedown="return false"></image>
  </body>

1 个答案:

答案 0 :(得分:0)

将此问题视为已关闭,因为我找到了解决方案:The event after loading image on IE9

谢谢,无论如何:)