当前,我的程序设定是,前端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”,每次新上传到服务端,根据名称删除原来的图片。
对于这种细节优化的建议:
拿到图片,点击上传之后,开始上传
每次拿到图片,可以存一下文件名+时间
到变量里,当用户点击多次上传的时候,把文件名+时间
和变量对比,如果一致,则不再处理这次请求(用户文件名+时间一致的情况太少,此处可略掉进一步容错处理了)
如果发现图片不一致,并且第一次请求还没有中断,则ajax abort
掉请求,发起第二次上传