Question

  $(".info-icon").hover(function() {
   var a = this.id;
   var id = a.substring(10);

   var $id = "infobox-"+id;
   $('#'+$id).addClass("hover");
  },
  function() {
   $('#'+$id).removeClass("hover");
  });

有人看到这个错误吗？

Thx Sven。

Answer 1

看起来您正在尝试将“悬停”类添加到不同的元素（稍后将其删除），这是基于操作获取的元素的id徘徊。如果是这样，我会这样做：

(function() {
    $(".info-icon").hover(function() {
        getHoverTarget(this).addClass('hover');
      },
      function() {
        getHoverTarget(this).removeClass('hover');
    });

    function getHoverTarget(element) {
       return $('#infobox-' + element.id.substring(10));
    }
})();

这可以避免重复逻辑（重复=以后搞乱它的机会）。

它无法按照您编写的方式工作的原因是SLaks points out，您的$id变量仅作为第一个函数中的本地存在;你的第二个功能无法访问它。

Answer 2

您的$id变量是一个局部变量，只存在于第一个回调中。

相反，您应该将ID存储在$.data。

中

Answer 3

$(".info-icon").hover(function() {
    $("#infobox-" + this.id.substring(10)).addClass("hover");
},
function() {
    $("#infobox-" + this.id.substring(10)).removeClass("hover");
});

Answer 4

将var $id = "";放在函数外部，使其成为全局函数，然后在第一个回调中删除var前面的$id，就像$id = "infobox-"+id;一样，这将然后将值存储在全局变量$id。

中

现在您可以在第二个回调中使用它。希望这会有所帮助。

Jquery .hover（）仅适用于mouseenter

4 个答案: