必须双击标签才能获取标签内容

Question

我的页面上有标签，这给我带来了麻烦。我认为它在js代码中。有时您必须双击选项卡，有时则不必。

这是在 Rails 中使用 HAML，我不太熟悉。我也没有写原始代码。我正在接手一个项目。

代码如下： HAML

#myTabs
 %ul.tab-buttons.tab-buttons--boxed.tab-buttons--left.js-tabs.nav-tabs
   %li.active.tab-button
    %a#tab1.tab-button-link.active{"data-toggle" => "tab", "data-projects" => "not_archived"} Current Projects
   %li.tab-button
    %a#tab2.tab-button-link{"data-toggle" => "tab", "data-projects" => "archived"} Archived Projects

.tab-content
 #tab1C.container
  %ul.list-project
   = render @projects
 #tab2C.container
  %ul.list-project

JS

$('.js-tabs li a:not(:first)').addClass('inactive');
  $('.container').hide();
  $('.container:first').show();

  $('.js-tabs li a').click(function(){
    var that = this;
    var t = $(that).attr('id');
    $.get("/projects", {projects: $(that).data("projects")}, function(){},'json')
      .done(function(data){
        var projects = data.projects;
        if($(that).hasClass('inactive')){
          $(that).removeClass('inactive');
          $(that).addClass('active');
          $('#'+t+'C .list-project').html(projects);
          $('.container').hide();
          $('#'+ t + 'C').fadeIn('slow');
        } else {
          $(that).removeClass('active');
          $(that).addClass('inactive');
          $('#'+t+'C .list-project').html(projects);
          $('.container').hide();
          $('#'+ t + 'C').fadein('slow');
      };
        $('.open-popup-link').magnificPopup(magnificPopupOptionsPermissionEmail);
      })
  });

我尝试在 codepen 中显示代码，但显示不准确。 Codepen

Answer 1

你是否发现刚进入页面需要双击，刷新页面需要单击？

如果是这样，那么涡轮增压可能是问题所在。一个常见的修复方法如下：

var ready;
ready = function() {
    // add your functions and calls here
}
$(document).ready(ready);
$(document).on('page:load', ready);