javascript - Jquery mouseleave setTimeout 不起作用

Question

我在 jQuery 中有以下代码:

$( ".name" )
  .on( "mouseenter", function() {
    $(this).find("ul").css({"font-size": "20px",
    'color': "red"});
   })
  .on( "mouseleave", function() {
    setTimeout(function () {
      $(this).find("ul").css({"font-size": "12px",
      'color': "blue"});
    }, 5000);
  });

第一部分工作正常，但第二部分损坏。

为什么是setTimeout上mouseleave不工作？

Answer 1

这是一个范围界定问题。 setTimeout 中的 $(this) 并不引用 $('.name')。您可以通过在正确的级别设置 this 变量并引用该变量来解决此问题。

.on("mouseleave", function() {

    var self = $(this);

    setTimeout(function() {
        self.find("ul").css({
            "font-size": "12px",
            'color': "blue"
        });
    }, 5000);
});