前端：迁移数据时，点击提交后跳出迁移中动画，数据提交完成时，显示进度条到100%，请问如何实现

Question

现在用的是jquery和bootstrap，想要实现点击提交后，开始跳出进度动画，同时发送后台数据，在数据发送完成时，动画进度条到达100%，请问如何实现？
以下是我自己写的代码，第一个是setTimeout的，但是这种自己感觉效果不好，感觉进度条是虚伪的，而且在数据提交时间不确定的情况下动画可能加载不完整
第二个是用ajax写的，不知道写的对不对，但是依然是做不到动画与提交数据同时进行，同时结束
版本1代码链接1
版本2代码链接2
我写在jsfiddle里面的代码运行好像还有点问题，本地调试时能够跳转，但jsfiddle里面不能跳转，动画也有点问题，不知哪位大神能指点下
同时还请问如何调试本地的ajax请求？