加载器未按预期显示
加载器未按预期显示
提问于 2018-08-10 03:26:02
我有一个页面，用户可以上传照片。我想要显示一个“正在加载...”消息，而照片上传到服务器，但由于某些原因，这是不工作的。该消息在用户选择要上传的文件时短暂显示，但随后在照片上传时消失。我想我把代码$('#loading').show();放错地方了。我怎么才能让它工作呢？非常感谢。
html
<div class="loading" id="loading">
<p>Loading...</p>
</div> jquery
$(document).ready(function() {
$('#loading').hide();
//Upload photo
$(".upload-button").on("click", function (e) {
e.preventDefault();
$(".file-upload").click();
$('#loading').show();//show the loader msg
});
$('#photoimg').on('change', function() {
$('#loading').hide(); //hide the loader msg
$("#preview").html('');
$("#imageform").ajaxForm({
target: '#preview'
}).submit();
}); 回答 1
Stack Overflow用户
回答已采纳
发布于 2018-08-10 03:36:15
更多的是你的.hide()函数会给你带来问题。它可以正常显示，但又过早地隐藏起来。您需要在上传照片后将其隐藏，并使用.ajaxForm options success触发回调函数。
最终，您还可以向.ajaxForm添加一个beforeSubmit选项，以初始显示加载器。
你可以在这里阅读更多- http://jquery.malsup.com/form/#options-object
$("#imageform").ajaxForm({
target: '#preview',
success: hideLoader
}).submit();
});
function hideLoader() {
$('#loading').hide();
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51774453
复制相关文章
相似问题