在现代的web开发中，前后端交互是一项非常重要的功能。而ajax作为一种常用的异步请求技术，可以实现无刷新的交互效果，大大提升了用户体验。在用户提交数据后，通常需要等待服务器返回结果，这个过程中，加载动画可以给用户一个明确的反馈，告诉他们正在处理中，避免用户以为页面卡死或出现其他异常。

例如，当用户在一个电商网站上点击“加入购物车”按钮时，查看到一个等待加载动画，这可以让用户明确知道系统正在处理他们的请求，而不是不做任何反应。如果没有加载动画，用户点击后页面不发生变化，可能会产生困惑和不满。又例如，当用户提交一个评论时，在评论提交的同时显示一个加载动画，可以让用户知道系统正在保存他们的评论，减少用户的不确定感。

下面我们来讨论一下如何利用ajax提交后加载动画。首先，在html页面中，我们需要定义一个展示加载动画的元素。这个元素可以是一个图片，也可以是一个使用css动画的标签。我们用一个div元素来代替展示加载动画。给它添加一个特殊的id属性，以便于在JavaScript脚本中找到它。

<div id="loading">
<img src="loading.gif" alt="Loading" />
</div>

在JavaScript代码中，我们使用ajax来发送请求并监听加载状态。在发送请求前，首先要找到加载动画的元素，并将其显示出来。然后，我们使用ajax的success方法来监听请求成功的状态。当请求成功时，我们可以根据需要执行一些操作，例如更新页面内容或者隐藏加载动画。下面是一个使用jQuery的ajax来实现这个流程的示例：

$('form').submit(function(event) {
// 阻止默认表单提交
event.preventDefault();
// 显示加载动画
$('#loading').show();
// 获取表单数据
var formData = $(this).serialize();
// 发送ajax请求
$.ajax({
url: 'submit.php',
type: 'POST',
data: formData,
success: function(response) {
// 请求成功后的操作
// ...
// 隐藏加载动画
$('#loading').hide();
}
});
});

在上面的代码中，我们使用了jQuery的submit方法来监听表单的提交事件。在事件处理函数中，我们首先阻止默认的表单提交行为，然后显示加载动画，并获取表单数据。接下来，我们使用ajax发送请求，指定请求的url、请求类型和数据。在请求成功后的回调函数中，我们可以根据需要执行一些操作。这些操作可以包括更新页面内容、隐藏加载动画等。

通过以上的代码和示例，我们可以实现一个在ajax提交后显示加载动画的效果。这样可以让用户清晰地知道系统正在处理他们的请求，增加用户体验的友好度。当然，加载动画的实现方式还有很多种，可以根据具体的需求和网站风格选择合适的方式。总之，无论是电商网站还是社交平台，使用ajax提交后加载动画都是一种常见的实践，能够有效提升用户体验。