javascript - 多次ajax上传的图片,如何删除??

WBOY
发布: 2016-08-04 09:19:58
原创
1088 人浏览过

当前,我的程序设定是,前端ajax修改头像,然后,将修改后图片的上传到后端。
最后发现,当用户多次点击上传按钮时,图片会上传多次。不便删除。
各位大神,有什么好的建议吗?

回复内容:

当前,我的程序设定是,前端ajax修改头像,然后,将修改后图片的上传到后端。
最后发现,当用户多次点击上传按钮时,图片会上传多次。不便删除。
各位大神,有什么好的建议吗?

上传期间,屏蔽上传按钮

<code>beforeSend: function () {
    // 禁用按钮防止重复提交
    $("#submit").attr({ disabled: "disabled" });
}
</code>
登录后复制

用benforeSend就可以了。。。

<code>$.ajax({
    type: "",
    data: "",
    dataType: "",
    url: "",
    beforeSend: function () {
        // 禁用按钮防止重复提交
        $("#submit").attr({ disabled: "disabled" });
    },
    success: function (data) {
        
    },
    complete: function () {
        $("#submit").removeAttr("disabled");
    },
    error: function (data) {
        
    }
});</code>
登录后复制

用户上传头像,上传后头像的命名可以为“user_用户ID”,每次新上传到服务端,根据名称删除原来的图片。

对于这种细节优化的建议:

  1. 拿到图片,点击上传之后,开始上传

  2. 每次拿到图片,可以存一下文件名+时间到变量里,当用户点击多次上传的时候,把文件名+时间和变量对比,如果一致,则不再处理这次请求(用户文件名+时间一致的情况太少,此处可略掉进一步容错处理了)

  3. 如果发现图片不一致,并且第一次请求还没有中断,则ajax abort掉请求,发起第二次上传

相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板