数据加载时如何为微调器提供选项卡

时间:2020-02-26 05:47:10

标签: javascript jquery html ajax codeigniter

function happening(){
  $(".spinner").show();
  $.ajax({
    type: "POST",
    url: "<?=base_url()?>timeline/timeline_v2_ajax",
    async:false,
    cache:false,
    error: function() {
      console.log('Something is wrong');
    },
    success: function(msg){
      $(".spinner").hide();
      $('#default-tab-1').html(msg);
      App.init();
      FormPlugins.init();
    }
  });
}

var LandingPage = function() {
  "use strict";
  return {
    init: function() {
      $('#default-tab-1').html('<span class="spinner"></span>');
      happening();
    }
  }
}()	

$(document).ready(function() {
  LandingPage.init();
  WhattodoPage.init();
});
<div class="content">
  <div class="col-md-12">
    <ul class="nav nav-tabs">
      <li class="active">
        <a href="#default-tab-1" data-toggle="tab" aria-expanded="true">
          <span class="semi-bold">What is happening ?</span>
        </a>
      </li>
      <li class="" id="what-to-do">
        <a href="#default-tab-2" data-toggle="tab" aria-expanded="false">
          <span class="semi-bold">What to do ?</span>
        </a>
      </li>
    </ul>
    <span class="spinner"></span>
    <div class="tab-content"> 
      <div class="tab-pane fade active in" id="default-tab-1"></div>
      <div class="tab-pane fade" id="default-tab-2"></div>
    </div>
  </div>
</div>

我有两个选项卡,在这里我想在两个选项卡中都加载数据时显示选项卡主体的微调框。上面是我的代码,因为我已经在脚本中包含了微调器,但是它不起作用。谁能帮帮我吗。任何帮助都将不胜感激。

1 个答案:

答案 0 :(得分:0)

我认为您应该首先检查“ .spinner”类。即此类是否具有适当的属性以显示或不显示任何内容。