如何在上传之前在javascript中显示图像

时间:2017-03-13 01:05:59

标签: javascript jquery html

html部分

 <asp:FileUpload class="fUploadStyle" runat="server" ID="fileupload" multiple="multiple" ClientIDMode="Static"  />
 <input style="width: 100px;" type="submit" runat="server" id="btnPreview" value="File Upload" onclick="filedetails(); return false;" />

<table id="tblUpload" style="margin: 0 auto;" border="1"></table>

当他们选择图像文件并且用户点击按钮时,他们将使用文件详细信息表进行预览并显示图像

这是javascript部分

$(document).ready(function () {
    filedetails = function () {
        var input = document.getElementById("fileupload");
        var output = document.getElementById("tblupload");

        output.innerHTML = '<tr>';
        output.innerHTML += '<th class="thstyle" style="width: 400px;"><b>file name</b></th><th class="thstyle" style="width: 150px;"><b>preview image</b></th>';

        for (var i = 0; i < input.files.length; ++i) {
            output.innerHTML += '<td style="padding: 10px; width: 400px;">' + input.files.item(i).name + '</td>' +
            '<td style="padding: 10px; width: 150px; color: #0d47a1"> Show </td>';
        }
        output.innerHTML += '</tr>';
    }
});

如何显示图像?甚至tif格式

this is the interface

0 个答案:

没有答案