首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >在IE中预览图片时关于更改Jquery事件的问题

在IE中预览图片时关于更改Jquery事件的问题
EN

Stack Overflow用户
提问于 2016-03-01 18:23:26
回答 1查看 18关注 0票数 0

我有一个问题,预览一个图像在IE。我的表单上有两个HTML控件。文件上传按钮,这是隐藏的和正常的用户点击上传图像预览。该代码在chrome和其他浏览器中运行良好。但是当在IE中添加图像时,它有一个问题。当我第一次上传文件时,它可以工作,但是下一次,当我上传相同或不同的图像时,更改事件就开始工作了。似乎更改事件第一次就不起作用了。有人能帮我解决这个问题吗?下面是我的密码。提前感谢

代码语言:javascript
代码运行次数:0
运行
复制
 <div class="upldImg">
            <img id="imgfakebrowse" ng-click='imageUpload()' src="../Images/upload.png" style="max-width:100%; max-height:100%;" />
            <input type="file" id="imgfilebrowse" name="imgfilebrowse" style="display: none">
        </div>

Javascript

代码语言:javascript
代码运行次数:0
运行
复制
//Profile Image Upload 
    $scope.imageUpload = function () {
        //intitalize the file input tag to Null to clear previous uploads
        document.getElementById('imgfilebrowse').value = null;

        $("#imgfilebrowse").trigger('click');


        $("#imgfilebrowse").change(function () {
            $scope.uploadtrigger(this);
        });
    }



    //function readURL(e) {
    $scope.uploadtrigger = function (input) {
        //var file = e.target.files[0];
        if (input.files && input.files[0]) {
            var reader = new FileReader();

            reader.onload = function (e) {
                $('#imgUploaded').attr('src', e.target.result);

                var CandidateDetails = $scope.contactById;
                if ($("#imgfilebrowse")[0].files[0] != null && $("#imgfilebrowse")[0].files[0] != '') {
                    image = $("#imgfilebrowse")[0].files[0];
                }
                else {
                    document.getElementById("imgUploaded").src = $scope.contactById.ProfileImage.Url;
                }
            }

            reader.readAsDataURL(input.files[0]);
        }
    }
EN

回答 1

Stack Overflow用户

发布于 2016-03-01 20:42:23

使用ng-src指令。

代码语言:javascript
代码运行次数:0
运行
复制
<div class="upldImg">
    <img id="imgfakebrowse" ng-click='imageUpload()' ng-src="{{imgUrl}}"
         style="max-width:100%; max-height:100%;" />
</div>

JS

代码语言:javascript
代码运行次数:0
运行
复制
$scope.imgUrl = "../Images/upload.png"

$scope.imageUpload = function () {
    $scope.imgUrl = $scope.contactById.ProfileImage.Url;
}

它更好地与AngularJS框架集成,并且具有更好的跨浏览器支持。

有关更多信息,请参见 Directive API Reference

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/35730499

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档