Question

我希望jQuery在我悬停元素之后做一些事情并在鼠标上执行其他操作。

我写了这个：

   jQuery('.item').hover(

        function() {
            var bg = jQuery(this).attr('data-background'); 
            jQuery(this).css("background-color", bg);
        }, 

        function() { /* this doesn't seem to work */
             alert(bg);  
        });

你能告诉我为什么这个代码在第二个函数之前工作正常，所以它从不提醒任何东西吗？我相信有一个错字，但我找不到; /

Answer 1

嗯，bg未在第二个函数中定义。它只在第一个本地。这将有效：

jQuery('.item').hover(
    function() {
        var bg = jQuery(this).attr('data-background'); 
        jQuery(this).css("background-color", bg);
    }, 
    function() {
         var bg = jQuery(this).attr('data-background'); 
         alert(bg);  
});

DEMO

为了对upvotes公平，你可以在两个函数都可以访问的范围内定义bg：

(function() {
    var bg;
    jQuery('.item').hover(
        function() {
            bg = jQuery(this).attr('data-background'); 
            jQuery(this).css("background-color", bg);
        }, 
        function() {
            alert(bg);  
    });
 }());

此处立即函数创建一个新范围（因此bg不会污染全局范围）。但是否这是必要的取决于你真正想做的事情。

DEMO

从jQuery 1.4.3开始，您也可以使用.data()访问data-background：

var bg = jQuery(this).data('background');

jQuery悬停不起作用

1 个答案: