Question

我认为这是一个简单的用例。我有两个部分的表格。我想等到第1部分完成后再启用第2部分。所以我只需在第2部分设置一个覆盖，当第1步完成时淡出。

我有一个js对象，上面有这个方法：

 // Fade In loader or Fade Out loader and overlay
        fadeLoader: function(){
            let loader = $('#entity-step-loader');

            if(loader.hasClass("loader-fade-in")) {
                    console.log('loader fade Out');

                loader.removeClass('loader-fade-in'); 
                $('#entity-step-overlay').fadeOut();

            } else {
                    console.log('loader fade in');

                $('#entity-step-overlay').fadeIn('fast', function(){
                    loader.addClass('loader-fade-in');
                });
            }
        },

在isReadyForStepTwo（）中调用此方法。 IT在开始时调用，然后在结束时调用。在开始和结束时进行此调用的原因是我们必须在启用步骤2之前检查步骤1中的条目。或者用户可以决定在步骤1中更改选项，这将涉及在步骤2中更改某些项目。 / p>

运行两次的方法是：

  fieldsToShow: function(){
            console.log('fields to show');
            entity.fadeLoader();

            // Empty identity fields 
            entity.emptyEntity(); 

            // DO A BUNCH OF CHECKING FOR STEP 1 FIELDS

            entity.fadeLoader();
        },

此方法在您第一次点击页面时起作用。您登陆页面，第2步有叠加层。完成第2步后，我们会在一秒钟内显示一个小的加载器动画，然后淡化加载器和叠加层，允许此人在字段中输入信息。

但是，如果我返回并更改步骤1中的选项，则该方法会再次重新打开覆盖。但是，就像我上面所说的那样，我再次运行该方法以使叠加层淡出。这种fadeOut没有发生。

Answer 1

您在loader-fade-in回调＆＃34;＆＃34;之后添加fadeIn课程。元素有＆＃34; finsihed＆＃34;淡入：

$('#entity-step-overlay').fadeIn('fast', function(){
  loader.addClass('loader-fade-in');
});

因此，当您第二次致电entity.fadeLoader();时，它仍然没有loader-fade-in类，它基本上只会再次通过else块。

尝试将其更改为：

$('#entity-step-overlay').fadeIn('fast')
loader.addClass('loader-fade-in');

如何在使用addClass返回true后使Jquery hasClass检查运行

1 个答案: