添加 setTimeout 后,Jquery 停止工作

时间:2021-02-10 23:05:23

标签: javascript jquery

我似乎无法使用 setTimeout 将一系列函数延迟 2 秒。它只是停止执行任何代码。我相信语法是正确的,当 setTimeout 被删除时,一切都按预期工作。如果有人可以提供帮助,我将不胜感激。谢谢。

$(document).ready(function() {
        var x = window.matchMedia("(max-width: 991px)");
        var navThree = window.innerHeight * 0.08;
        var navToo = window.innerHeight * 0.1;
        $('.FeatureExpand').click(function() {
            setTimeout(function() {
            $(this).find(".Feature_1-1").toggleClass("Feature_1-1-Expanded Feature_1-1-Contracted")
            $(this).find(".featureTitle_1 ").toggleClass("title-Collapsed title-Expanded")
            $(this).find(".FeatureDescription-L").toggleClass("extendLeft-Expanded extendLeft prodFeature_1-des prodFeature_1-des-Expanded")
            $(this).find(".FeatureDescription-R").toggleClass("extendRight-Expanded extendRight prodFeature_1-des prodFeature_1-des-Expanded")
            $(this).find(".featureCopy").toggleClass("featureCopy-show featureCopy-hide")
            $(this).find(".Feature_1-img").toggleClass("img-Collapsed img-Expanded")
            $(this).find(".logoSplash, .hamSplash").toggleClass("splash40vh splash15vh")
            $(this).find(".FeatureSpacer").toggleClass("splash40vh splash15vh")
            $(this).find(".FeatureContent").toggleClass("FChidden FCshow")
            $(this).find(".FCpair").toggleClass("FCpair-hide FCpair-show")
            $(this).find(".feature-icon-left").toggleClass("feature-icon-left-Collapsed feature-icon-left-Expanded")
            $(".Feature_1-1").bind("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(){ Waypoint.refreshAll() });
            if (x.matches) {
              $('html,body').animate({scrollTop: $(this).offset().top - navThree});
                }
              else {
              $('html,body').animate({scrollTop: $(this).offset().top - navToo});
                }
            }, 2000 );
        });
    });

2 个答案:

答案 0 :(得分:2)

我认为您在匿名函数中丢失了 this,因此 $(this) 未定义或引用其他内容... 在调用 setTimeout 之前,尝试

var that = $(this);
setTimeout(function() {
    that.find(...)
},1000);

答案 1 :(得分:0)

谢谢大家的帮助!似乎当正确添加粗箭头 (=>) 时,问题已解决。这是新代码。

    $(document).ready(function() {
        var x = window.matchMedia("(max-width: 991px)");
        var navThree = window.innerHeight * 0.08;
        var navToo = window.innerHeight * 0.1;

        $('.FeatureExpand').click(function() {
            if (x.matches) {
              $('html,body').animate({scrollTop: $(this).offset().top - navThree});
                }
              else {
              $('html,body').animate({scrollTop: $(this).offset().top - navToo});
                };
                
            setTimeout(() => {
            $(this).find(".Feature_1-1").toggleClass("Feature_1-1-Expanded Feature_1-1-Contracted")
            $(this).find(".featureTitle_1 ").toggleClass("title-Collapsed title-Expanded")
            $(this).find(".FeatureDescription-L").toggleClass("extendLeft-Expanded extendLeft prodFeature_1-des prodFeature_1-des-Expanded")
            $(this).find(".FeatureDescription-R").toggleClass("extendRight-Expanded extendRight prodFeature_1-des prodFeature_1-des-Expanded")
            $(this).find(".featureCopy").toggleClass("featureCopy-show featureCopy-hide")
            $(this).find(".Feature_1-img").toggleClass("img-Collapsed img-Expanded")
            $(this).find(".logoSplash, .hamSplash").toggleClass("splash40vh splash15vh")
            $(this).find(".FeatureSpacer").toggleClass("splash40vh splash15vh")
            $(this).find(".FeatureContent").toggleClass("FChidden FCshow")
            $(this).find(".FCpair").toggleClass("FCpair-hide FCpair-show")
            $(this).find(".feature-icon-left").toggleClass("feature-icon-left-Collapsed feature-icon-left-Expanded")
            $(".Feature_1-1").bind("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(){ Waypoint.refreshAll() });
            }, 1000 );
        });
    });