1

我是 Django 和这些东西的新手,我需要一些技巧或解决方案来添加微调器。我正在使用 spin.js,我以这种方式展示它:

 var target = document.getElementById('spin');
    var spinner = new Spinner(opts).spin(target);
    spinner.stop();
    function spin_stop()
    {
        spinner.stop();
    }
    function spin_start()
    {
        spinner.spin(target);
    }

此代码是从网络上的一些示例中复制而来的。我显示微调器<div id...>

现在有一个问题。

我在 Django 中有一个名为 testScript 的应用程序。该应用程序连接到不同的页面以验证登录信息。这是一个“漫长”的过程,大约需要 10 秒。那时,我想在我的登录页面上添加一个微调器。在模板中我有一个表格:

<form class="form-signin" action="/testScript/" method="post">

如果我想以这种形式在我的按钮中添加 onclick 事件,我的微调器会冻结。

当我的 testScript 正在处理时,我如何显示微调器?

谢谢

4

1 回答 1

2

微调器冻结,因为浏览器已更改页面并等待新页面响应。

您可以尝试使用动画 gif作为微调器而不是 spin.js,但这也可能会冻结。

如果您的验证过程确实需要 10 多秒,那么您最好的选择是使用 Ajax 提交 POST,然后在服务器响应后重定向或显示响应。

如何使用 Ajax 取决于您的工作流程。如果您不介意额外的库,最简单的 Ajax POST 方法是使用 jQuery。一旦响应在页面上的 div 中显示响应或重定向到另一个视图。

$.ajax({
    url: "/testScript/",
    method: "POST",
    data: { //form data
    },
    success: function(data) {
        //Display response here
    },
    complete: function() {
        //Hide spinner here
    }
});

这是非常简单的,因为我没有关于您的应用程序或标记的足够详细信息,但是这里有很多类似的解决方案可以帮助您。

于 2013-05-08T16:57:50.963 回答