【问题标题】：Upload Image without Postback上传图片而不回发
【发布时间】：2014-04-02 10:20:52
【问题描述】：

我在单击按钮时使用 API 将图像上传到imgur.com，但我想避免在单击按钮时刷新页面，我尝试将 onClick 禁用为 false 并通过 jquery 手动调用函数，但不幸的是我无法运行它，是有没有其他方法可以上传而无需回发？

第二个问题：我们不能将简单的方法调用静态。在静态中调用其他方法有什么技巧吗？

【问题讨论】：

您可以在 HTML 5 或 IFrame 实现中使用 FileAPI 来避免回发
有jquery插件，比如malsup.com/jquery/form

标签： jquery asp.net upload postback

【解决方案1】：

我认为这会对你有所帮助：

这是上传“.jpg”文件的代码

脚本代码：

<script src="JS/jquery-2.1.0.js"></script>
<script type="text/javascript">
    function SaveAllDetails() {
        if (document.getElementById("FileUploadMyImage").value != "") {
            var file = document.getElementById('FileUploadMyImage').files[0];
            var reader = new FileReader();
            reader.readAsDataURL(file);
            reader.onload = UpdateFiles;
        }
        else {
            alert('Please Choose An Image');
        }
    }

    function UpdateFiles(evt) {
        var result = evt.target.result;
        var ImageSave = result.replace("data:image/jpeg;base64,", "");
        var savobject = { 'savingvalues': ImageSave };
        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "Default.aspx/SaveAllDetails",
            data: JSON.stringify(savobject),
            dataType: "json",
            success: function () {
                alert('SuccessFully Uploaded');
            },
            error: function () {
                alert('Not Uploaded');
            }
        });
    }
</script>

HTML 部分：

<div>
<input type="file" id="FileUploadMyImage" />
    <input type="button" value="Submit" onclick="SaveAllDetails();" />
</div>

asp.net 表单背后的代码：

[WebMethod(EnableSession = true)]
public static void SaveAllDetails(string savingvalues)
{
    byte[] getImageData = Convert.FromBase64String(savingvalues);
}

变量“getImageData”是您的图像，您可以将其直接发送到您的“存储过程”

【讨论】：

它不会更新文件（evt）我写了警报命令并检查它是否显示阅读器数据而不是 savobject 对象
首先你应该确保你在开头添加了最新的jquery版本，然后用脚本检查Fileupload控件的id：即：document.getElementById("FileUploadMyImage" ) 和
是的！我已经验证了这些东西，并且在按钮中它在 onClick 上显示错误，所以我使用了 onClientClick ..这是导致问题的原因吗？因为代码页中的 onClick 在该行显示错误
不管怎样都成功了！错误是超出大小限制的base64数据！编辑 web.config 文件解决了这个问题。谢谢