将变量设置为（document）.ready是否可以使用所有功能？

Question

jQuery真的很新，这让我感到困惑了一段时间。

我将以此为例：

$(document).ready(function(){

        $("#link1 a").hover(function(){
            var $this = $(this);
            $this.css("color", "#fff");
        });
    });

显然，这将在悬停时将＃link1内部的颜色更改为白色。

这就是我想要做的：

    $(document).ready(function(){

      var $this = $(this);

      $("#link1 a").hover(function(){
        $this.css("color", "#fff");
      });

      $("#link2 a").hover(function(){
        $this.css("color", "#f00");
      });
    });

这行不通。

我可以设置var $ this = $（this）; 内部（document）.ready是否可以与其中的所有功能一起使用？

抱歉，这是一个愚蠢的问题，在其他任何地方都找不到答案。 如果我说实话，不是100％肯定会搜索！

Answer 1

您的声明var $this = $(this); 虽然有效，但无法满足您的需求。 如果您考虑一下...这是指$(document)

因此，如果将代码更改为此：

$(document).ready(function(){

  $("#link1 a").hover(function(){
    var $this = $(this);
    $this.css("color", "#fff");
  }); //In this case $this refers to $("#link1 a")

  $("#link2 a").hover(function(){
    var $this = $(this);
    $this.css("color", "#f00");
  }); //In this case $this refers to $("#link2 a")
});

但是，这并不是真正必要的，因为您可以这样做：

$(document).ready(function(){

  $("#link1 a").hover(function(){
    $(this).css("color", "#fff");
  });

  $("#link2 a").hover(function(){
    $(this).css("color", "#f00");
  });
});

现在，如果您想扩大$this的范围，可以执行以下操作：

$(a).hover(function() {
    var $this = $(this);

    //now if you wanted to check for which link is currently hovered you can say this :
    var link = $this.attr("id");
    //this will set link equal to the current id

    //NOW you can have if statements checking which link it is...
    if(link == "link1") { ... do stuff }
    if(link == "link2") { ... do other stuff }
}

另外，如果您使用的是jQuery POST 1.7版的JQuery，则应调用如下事件：

$(a).on("hover", function () {
    ...some function
});

最后，不要害怕查看JQuery API的一些帮助……它写得很好，并提供了示例

https://api.jquery.com/

Answer 2

不，但是您可以选择所有内容-

$(document).ready(function() {

    $this = $('*'); // all elements in the DOM for this page

});

我不推荐，但是为什么要这么做呢？