javascript - xeditable 的加载指示器

Question

我正在使用 X-Editable（早期的 Bootstrap-Editable）进行就地编辑。在服务器上保存数据大约需要 2-3 秒。同时这个时间跨度，我想放一个加载指示器。我该如何实施？

Answer 1

调用 ajaxfunction 来更新包含加载图标，如下面的函数：

function ajaxUpdate()
{
    var def = '<img src="./images/loader.gif" />';
    $('#loading').html(def);
    $('#loading').show();
    jQuery.post("<?php echo site_url('myController/updateDetails');?>", {
      v1 : $('#v1').text(),
      v2 : $('#v1').text(),
      v3 : $('#v1').text()
    },
    function(response)
    {
       if(response==1)
       {
          //success area
          $('#loading').hide();
       }
       else
       {
          // failure area
       }
    });
}

---

<div id="loading"></div>

调用此函数时，加载图像会显示在带有 id加载的 div 上， 并且在 ajax 调用成功后它将被隐藏。