Question

我必须在bootstrap模式上进行列布局，在左栏中显示上传文件名列表，而在右栏显示上传文档的预览，如果在左列上的文件名之一上有单击事件。 / p>

这是我用来显示文档预览的div。

<div id="img-container">
  <div id="docs" style="height:100%"></div>
</div>

这是我用来显示文档的ajax代码。

  $('.pdf-docs').click( function () {
      var file = $(this).attr('data-file'); // filename display on the left
      var url  = $(this).attr('data-file-url')+'/'+file; // url where to get the file
      $.ajax({
        url:url,
        dataType: 'json',
        type: 'get',
        success:function(data) {
          $('#img-container #docs').html('<embed src="' + data.file_uploaded + '" width="100%" height="100%">');
        },
        beforeSend: function() {
          $('div#waitme').waitMe({
                effect:  'stretch',
                bg:      'rgba(255,255,255,0.7)',
                color:   '#000',
            });
        },
        complete: function() {
          $('#waitme').waitMe('hide');
        }
      });
  });

这个ajax代码，在codeigniter控制器上发出请求，返回文件所在的路径。

div#waitme是我实现预加载器的两列div的父级。

beforesend:上的预加载器成功渲染，但即使文档已满载也不会停止或隐藏。

对此有什么最佳解决方案吗？

waitme来源：https://github.com/vadimsva/waitMe

如何在完全加载的文档后隐藏预加载器

0 个答案: