Question of code logic



  • function openSubMenu() {
    
        $('.work-examples__li').each(function () {
            testingByNik();
        });
    
        function testingByNik() {
            $(this).on("click", function () {
    
                //var tarGet = $(".work-examples .example.view-project-first");
                //var activeBlock = $(".first .work-examples__li_active");
    
                var tarGet = $(this).find(".example");
                var activeBlock = $(this).find(".work-examples__li_active");
    
    
                $(".projects__content .work-examples .example:not('.view-project-first')").removeClass("pop-up");
                $(".projects__content .work-examples .work-examples__li_active:not('.first')").removeClass("visible");
    
                if (!tarGet.hasClass('pop-up') && !activeBlock.hasClass('visible')) {
                    tarGet.addClass('pop-up');
                    activeBlock.addClass('visible');
                } else {
                    tarGet.removeClass('pop-up');
                    activeBlock.removeClass('visible');
                }
            });
        }
    }
    

    And so, for .work-examples__li I'm doing my job. testingByNikThis function is performed when I click .work-examples__li♪ Next. tarGet - That's it. .work_examples__li .example, a .activeBlock That's it. .work-examples__li .work-examples__li_active.Right?



  • This function is performed when I click...

    No, this function is performed when you call it. The event processor shall be performed on the blade click - anonymous function

    $(this).on("click", function () {
      ...
    });
    

    Based on the code inside testingByNik♪ You expect the context for her to be one of the elements ♪ '.work-examples__li'♪ In your code, it's not like you're calling it in a global context. window

    You can do this:

    $('.work-examples__li').each(function () {
      testingByNik.call(this);
    });
    

    But there's no need in your cycle. For all the elements you've chosen, you do the same thing.

    $('.work-examples__li').on("click", function () {
    
    //var tarGet = $(".work-examples .example.view-project-first");
    //var activeBlock = $(".first .work-examples__li_active");
    
    var tarGet = $(this).find(".example");
    var activeBlock = $(this).find(".work-examples__li_active");
    
    $(".projects__content .work-examples .example:not('.view-project-first')").removeClass("pop-up");
    $(".projects__content .work-examples .work-examples__li_active:not('.first')").removeClass("visible");
    
    if (!tarGet.hasClass('pop-up') && !activeBlock.hasClass('visible')) {
        tarGet.addClass('pop-up');
        activeBlock.addClass('visible');
    } else {
        tarGet.removeClass('pop-up');
        activeBlock.removeClass('visible');
    }
    

    });




Suggested Topics

  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2