Question

我在jquery中有一个函数，它允许我获取在ie7上传的文件的名称。我能够获取文件的名称，但我也试图获取该文件的base64字符串。有没有办法在下面改变这个功能呢？

var thumbnail_title_preview = {

    update: function(value, event_target) {

        var parent_upload_fields = $(event_target).parents('.upload-photos');
        var photos_list = $('.upload-photos-list-inner', parent_upload_fields);

        var thumbnail = document.createElement("div");
        $(thumbnail).addClass('uploaded-thumbnail-title');

        var file_name = value;

        if(ie7) {
            file_name_array = file_name.split('\\');
            file_name = file_name_array[file_name_array.length - 1];

        } else {
            file_name = file_name.replace('C:', '');
            file_name = file_name.replace('D:', '');
            file_name = file_name.replace('\\fakepath\\', '');

        }

        if(file_name.length > 12) {
            file_name = file_name.substring(0, 12) + '...';
        }

        $(thumbnail).append('<p>' + file_name + '</p>');

        $(thumbnail).append('<a class="remove-photo" href="#"></a>');
        $(photos_list).append(thumbnail);

        var number_of_thumbnails = $('.uploaded-thumbnail-title', parent_upload_fields).length;
        $(photos_list).css({ 'width': number_of_thumbnails * (117 + 20) });

        if(number_of_thumbnails == 5) {
            $('.upload-photos-add', parent_upload_fields).css({ 'display': 'none' });
            $(parent_upload_fields).addClass('has-five-photos');
        } else {
            $(parent_upload_fields).removeClass('has-five-photos');
        }

        if(ie7) {
            updateTinyScrollbar();

        } else {
            $('.upload-photos-list').perfectScrollbar('update');

            var scrollbar_style = $('.ps-scrollbar-x-rail', parent_upload_fields).css('display');

            if(scrollbar_style == 'block') {
                $(parent_upload_fields).addClass('has-perfect-scrollbar');
            } else {
                $(parent_upload_fields).removeClass('has-perfect-scrollbar');
            }

        }

    }
}

这是html：

<div class="upload-photos clearfix" runat="server">

    <div class="upload-photos-add" id="Q0011_00" runat="server">
        <asp:AjaxFileUpload ID="AjaxFileUpload1" runat="server" AllowedFileTypes="jpg,jpeg,png,gif" OnClientUploadComplete="onClientUploadComplete" OnClientUploadCompleteAll="onClientUploadCompleteAll" OnClientUploadStart="onClientUploadStart"  ></asp:AjaxFileUpload>
    </div>

    <div class="upload-photos-list">
        <div class="upload-photos-list-inner clearfix" runat="server" id="divUploadListDynamic0011_00">
        </div>                                                                              
    </div>

</div>

Answer 1

如果图像文件不是 crossOrigin（请参阅canvas.toDataURL() SecurityError，Understanding the HTML5 Canvas image security rules），则应该能够检索data-uri图像file的表示形式1}}利用HTMLCanvasElement.toDataURL()。如果图片文件或src crossOrigin，可以使用FileReader来检索data-uri {{} {{ 1}}元素 - 作为DOM img - 代替type的{{1}} text/html canvas），以避免.toDataURL() type可能存在CORS问题（请参阅上面的链接）

尝试

image/png

tainted

从ie7的输入中获取base64图像？

1 个答案: