访问 jquery 选择器中的函数

Question

我需要一个函数作为 public 以便我可以在任何 jquery 选择器中调用它，这是代码。注意：控制台说 checkFeat fn 未定义。

   (function checkFeat() {
    $(".feat").each(function(){
        if (!$(this).hasClass("active")) {
            $(this).children("P").css("display","none")
        }
        else
        {
            $(this).children("P").css("display","block")
        }
    });    
}());

$(".feat h5").on("click",function(){
    $(this).parent(".feat").addClass(function(index ,currentClass){
        checkFeat();  //console says this function is not defined why ?!!
        return "active";
    });
});

Answer 1

在你的 Javascript 文件中，你可以只写：

function checkFeat() {
  $(".feat").each(function(){
      if (!$(this).hasClass("active")) {
          $(this).children("P").css("display","none")
      }
      else
      {
          $(this).children("P").css("display","block")
      }
  });    
}

$(".feat h5").on("click",function(){
    $(this).parent(".feat").addClass(function(index ,currentClass){
        checkFeat();  //console says this function is not defined why ?!!
        return "active";
    });
});

那么如果你想单独调用这个函数，你可以直接调用：

checkFeat();

Answer 2

您将 checkFeat() 限制在 closure 内，无法在封闭环境外使用。删除它，一切都会正常工作。

MDN JS DOCS:

Closures are functions that refer to independent (free) variables (variables that are used locally, but defined in an enclosing scope). In other words, these functions 'remember' the environment in which they were created.

function checkFeat() {
    $(".feat").each(function(){
        if (!$(this).hasClass("active")) {
            $(this).children("P").css("display","none")
        }
        else
        {
            $(this).children("P").css("display","block")
        }
    });    
}

$(".feat h5").on("click",function(){
    $(this).parent(".feat").addClass(function(index ,currentClass){
        checkFeat();
        return "active";
    });
});

访问 jquery 选择器中的函数

accessing a function inside jquery selector

javascript

jquery

function

public

selector