Question

我正在使用canvas进行Web应用程序，用户可以在其中绘制图像并将文件上传到画布。我只能将图像上传到画布，但我也需要上传.docx或.txt文件。

以下是上传图片的代码

.aspx页面中的代码

 <div style="text-align:center;">
        <p>
            <input id="fileUploadImg" type="file"   />
        </p>
        <p>
            <input type="button" id="btnOKOpen" value="OK" onclick="UpdateCanvas(); return false;" />
            <input type="button" id="btnCancelOpen" value="Cancel" />
        </p>
    </div>

单击按钮时，将调用以下函数updatecanvas（）。

.js文件中的代码

function UpdateCanvas() {
var file_UploadImg = document.getElementById("fileUploadImg");
var fileExtension = "";

限制了用户可以上传的文件类型。虽然我在“else if”中指定了.docx或.txt，但条件未经过验证。我可以单独上传.png，.jpg但不能上传任何其他内容。扩展

if (fileExtension == "jpg") {
    return true;
}
else if(fileExtension == "txt")
{
    return true;
}
else if (fileExtension == "doc") {
    return true;
}
else if (fileExtension == "docx") {
    return true;
}
else if (fileExtension == "ppt") {
    return true;
}
else if (fileExtension == "pptx") {
    return true;
}
else if (fileExtension == "xml") {
    return true;
}
else if (fileExtension == "png") {
    return true;
}

 else {
    alert("You must select a GIF file for upload");
    return false;
     }
    LoadImageIntoCanvas(URL.createObjectURL(file_UploadImg.files[0]));
 }

function LoadImageIntoCanvas(bgImageUrl) {

var image_View = document.getElementById("imageView");
var ctx = image_View.getContext("2d");

var img = new Image();

img.onload = function () {
    image_View.width = img.width;

    image_View.height = img.height;
    WIDTH = img.width;
    HEIGHT = img.height;
    ctx.clearRect(0, 0, image_View.width, image_View.height);
    ctx.drawImage(img, 1, 1, img.width, img.height);
}
img.src = bgImageUrl;
}

还有其他方法上传这种类型的文件吗？我是画布的新手。如果有的话，请帮帮我！在此先感谢!!

如何使用javascript在canvas中上传.txt或.docx文件

0 个答案: