jquery - 访问 $(this).each function() 之外的 DOM 元素

Question

我在 JSP 上有一个 div，当我将鼠标悬停在与特定 css 类关联的项目上时，我想填充它，但看起来我遇到了范围问题。知道我做错了什么吗？

JSP: $('.hoverTrigger').myFunc();

文字在这里

JSP 引用的 JavaScript .js 文件：

$.fn.myFunc = function(options) {
  $(this).each(function() {
    $this.hover(
       function() {
         // Want to set text in messageBox here but not working
         $('#messageBox').after("Hover IN").remove();
       },
       function() {
         // Want to set text in messageBox here but not working
         $('#messageBox').after("Hover OUT").remove();
       }
    );

  });
};

Answer 1

我想你想要$(this).hover而不是$this.hover. 此外，如果您#messageBox在鼠标移入时删除，您将无法在鼠标移出时选择它。

Answer 2

$(this).hover();// 应该可以解决问题。否则你可以缓存变量。

var currobj; 
 $(this).each(function() {
currobj=$(this)//cache the current object. and use it 
    $(currobj).hover(
       function() {
         // Want to set text in messageBox here but not working
         $('#messageBox').after("Hover IN").remove();
       },
       function() {
         // Want to set text in messageBox here but not working
         $('#messageBox').after("Hover OUT").remove();
       }
    );

  });