贰拾肆樵 2016-05-13 01:50 采纳率: 50%
浏览 1049
已采纳

求助: 为何我这个代码里的事件会自动被window对象触发

用onchange绑定了一个事件,然而每次刷新页面会自动触发这个事件,alert了事件源获得了window对象
求解~~~~
代码如下

 <!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">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>图片上传预览 ie6,7,8, firefox</title>
</head>
<body>
    <input type="file" multiple="true" id="picPath" name="imgPath" />
    <div id="Preview">
        <img id="Preview" />
        <img id="Preview2" />
    </div>
</body>
<script src="imageUpload.js"></script>
<script>
        document.getElementById("picPath").onchange = PreviewImage({
            PreviewElementId : "Preview",
            fileInput : this,
            width : "120px",
            height : "120px"
        });
</script>
</html>

下面是JS方法(未完成的方法)

  /*图片格式验证*/
function checkPic() {
    var picPath = document.getElementById("picPath").value;
    var type = picPath.substring(picPath.lastIndexOf(".") + 1, picPath.length).toLowerCase();
    if (type != "jpg" && type != "bmp" && type != "gif" && type != "png") {
        alert("请上传正确的图片格式");
        return false;
    }
    return true;
}

//图片预览
function PreviewImage(jsonObj) {
    var upload = jsonObj.fileInput;
    var PreviewElementId = jsonObj.PreviewElementId;
    alert(upload);
    var width = jsonObj.width;
    var height = jsonObj.height;

    if (checkPic()) {
            var imgPath;      //图片路径
            var imgPath2;
            var Browser_Agent = navigator.userAgent;
            //判断浏览器的类型
            if (Browser_Agent.indexOf("Firefox") != -1) {
                //火狐浏览器
                imgPath = window.URL.createObjectURL(upload.files[0]);   /*需要添加是否双图判断*/
                imgPath2 = window.URL.createObjectURL(upload.files[1]);
                document.getElementById(divImage).innerHTML = "<img id='imgPreview' src='" + imgPath + "' width='" + width + "' height='" + height + "'/>";
                document.getElementById(divImage2).innerHTML = "<img id='imgPreview' src='" + imgPath2 + "' width='" + width + "' height='" + height + "'/>";
            } else {
                /*多地址解析*/
                var valuesArray = upload.value.split(",");
                var imgSrc1 = valuesArray[0];
                var imgSrc2 = valuesArray[1];
                /*容器设置*/
                var localImagId1 = document.getElementById(divImage);
                var localImagId2 = document.getElementById(divImage2);
                //必须设置初始大小 

                //图片异常的捕捉,防止用户修改后缀来伪造图片 
                //filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' http://')
                try {
                    localImagId1.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader((enabled='true' ,src='" + imgSrc1 + "');";
                    alert(localImagId1.style.filter);
                    /*localImagId1.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc1;
                    localImagId2.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc2;*/
                } catch (e) { 
                    alert(e);
                    return false;
                }
               /* imgObjPreview1.style.display = 'none';
                imgObjPreview2.style.display = 'none';*/
                /*document.selection.empty();*/
                    }
    }
}
  • 写回答

1条回答 默认 最新

  • Go 旅城通票 2016-05-14 03:03
    关注

    document.getElementById("picPath").onchange = PreviewImage({

    这句每次都执行了PreviewImage函数,此环境下this==window,然后将PreviewImage返回值作为onchange的事件,PreviewImage没有return返回值会默认返回undefined所以onchange为undefined没有绑定,改成这样才能绑定事件

      document.getElementById("picPath").onchange =function(){ 
                       PreviewImage({
                PreviewElementId : "Preview",
                fileInput : this,//此时this才是这个dom对象
                width : "120px",
                height : "120px"
            });
    }
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 不是,这到底错哪儿了😭
  • ¥15 2020长安杯与连接网探
  • ¥15 关于#matlab#的问题:在模糊控制器中选出线路信息,在simulink中根据线路信息生成速度时间目标曲线(初速度为20m/s,15秒后减为0的速度时间图像)我想问线路信息是什么
  • ¥15 banner广告展示设置多少时间不怎么会消耗用户价值
  • ¥16 mybatis的代理对象无法通过@Autowired装填
  • ¥15 可见光定位matlab仿真
  • ¥15 arduino 四自由度机械臂
  • ¥15 wordpress 产品图片 GIF 没法显示
  • ¥15 求三国群英传pl国战时间的修改方法
  • ¥15 matlab代码代写,需写出详细代码,代价私