Jsp 如何在Bootstrap 3中使用Ladda UI

Jsp 如何在Bootstrap 3中使用Ladda UI,jsp,servlets,twitter-bootstrap-3,Jsp,Servlets,Twitter Bootstrap 3,我对Bootstrap3的LaddaUI有点困惑,它将加载指示器合并到调用它们的操作中。当我单击按钮时,它将执行SQL查询。那个么,当查询完成时,如何停止自旋效应呢?我使用jsp和servlet。请参阅:以获取文档 $(function() { $('#form-submit').click(function(e){ e.preventDefault(); var l = Ladda.create(this); l.start();

我对Bootstrap3的LaddaUI有点困惑,它将加载指示器合并到调用它们的操作中。当我单击按钮时,它将执行SQL查询。那个么,当查询完成时,如何停止自旋效应呢?我使用jsp和servlet。

请参阅:以获取文档

$(function() {
    $('#form-submit').click(function(e){
        e.preventDefault();
        var l = Ladda.create(this);
        l.start();
        $.post("your-url", 
            { data : data },
          function(response){
            console.log(response);
          }, "json")
        .always(function() { l.stop(); });
        return false;
    });
});
此处您的url应该是一个预执行sql的url,此url的结果应该是:

The type of data that you're expecting back from the server. If none is specified, jQuery will try to infer it based on the MIME type of the response (an XML MIME type will yield XML, in 1.4 JSON will yield a JavaScript object, in 1.4 script will execute the script, and anything else will be returned as a string). The available types (and the result passed as the first argument to your success callback) are: xml, html, json, jsonp or text
现在,您可以根据响应数据或ajax请求调用l.stop

// Assign handlers immediately after making the request,
// and remember the jqxhr object for this request
var jqxhr = $.post( "example.php", function() {
  alert( "success" );
})
  .done(function() {
    alert( "second success" );
  })
  .fail(function() {
    alert( "error" );
  })
  .always(function() {
    alert( "finished" );
});