如何在asp.net c#上载之前预览多个缩略图图像

时间:2017-03-15 06:11:59

标签: javascript

在这只有一个图像显示。我想预览多张图片。

我试试这段代码

<script src="//code.jquery.com/jquery-1.11.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
    function ShowImagePreview(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();
            reader.onload = function (e) {
                $('#<%=img.ClientID%>').prop('src', e.target.result)
                    .width(240)
                    .height(150);
            };
            reader.readAsDataURL(input.files[0]);
        }
    }
</script>

    

1 个答案:

答案 0 :(得分:3)

Nitika的工作

<input type="file" name="imageUploader" value="" id="imageUploader" multiple="">
<div id="imgViewer"></div>
<script type="text/javascript">
    function readURL(input) {
        if (input.files && input.files.length > 0) {
            for (var i = 0 ; i < input.files.length; i++) {
                var reader = new FileReader();
                $('#imgViewer').empty();
                reader.onload = function (e) {
                    $('#imgViewer').attr('src', e.target.result);
                    $('#imgViewer').append($('<img>', { src: e.target.result, width: '50px', height: '50' }));
                }
                reader.readAsDataURL(input.files[i]);
            }
        }
    }
    $("#imageUploader").change(function () {
        readURL(this);
    });
</script>