显示“页面加载”消息

我正在尝试在html页面中显示“页面加载”的图像（.gif），直到显示my_script.py的输出，我不知道该怎么做。 这是我到目前为止所得到的。 提前谢谢了。

HTML：

 
 Please Wait
 
 
   

JS：

  $(document).ready(function() { $("form").submit(function() { showLoading(); $('#content').load('./cgi-bin/my_script.py', null, showResponse); }); function showResponse() { hideLoading(); } function showLoading() { $("#loading").show(); } function hideLoading() { $("#loading").hide(); } }); 

Answer 1

您的脚本可以简化为：

 $(document).ready(function() { $("form").submit(function(e) { e.preventDefault(); $('#content').html('put your loading html here').load('/ajax_html_echo/',function(response, status, xhr) { //This is the callback. You can check for error here. //For example if (status == 'error') alertTheMedia(); }); }); });​ 

我做的修改是：

• e.preventDefault()用于在用户启用Javascript时阻止默认表单提交。
• 将加载消息添加到#content选择器，将html()的内部更改为您要显示的内容。 这将导致初始内容成为您的加载消息，然后它将被成功时由.load返回的内容替换，或者如果它是错误，您将必须明确告诉它要替换的内容。
• 压缩代码，更易于阅读，更易于维护。

小提琴

http://jsfiddle.net/8pgrD/