Question

以下代码对.css({"background":"black"});的所有元素执行class="hole"，但是我试图在class="hole"和data-hole-key="[hole_key_variable]"的元素上执行此操作。

缺少什么？

jQuery的：

// on elements with class "hole" hovered
$('.hole').hover(
    function(){ 
        // get the data value of the currently hovered element
        var holeKey = $($(this).data('holeKey'));
        // on all elements with that class "hole" and specified data value, change bgcolor
        $('.hole').data(holeKey).css({"background":"black"});
    },
    function(){
        var holeKey = $($(this).data('holeKey'));
        $('.hole').data(holeKey).removeAttr('style');
    }
);

HTML：

<td class="hole" data-hole-key="1">text</td>
<td class="hole" data-hole-key="2">text</td>
<td class="hole" data-hole-key="3">text</td>

顺便说一句，为什么这个（错误的）代码在没有双重包装这一行的情况下根本不起作用：

var holeKey = $($(this).data('holeKey'));

Answer 1

修改重新思考我认为你想要做的事情 - 这首先剪断将只改变悬停元素CSS

$('.hole').hover( function(){ $(this).css({"background":"black"}); }, function(){ $(this).removeAttr('style'); } );

您的代码导致问题

这部分不会返回值，因为你将它包装在jQuery中，并且被包装的值不是选择器

// get the data value of the currently hovered element var holeKey = $($(this).data('holeKey'));

从元素数据中获取值

// get the data value of the currently hovered element var holeKey = $(this).data('holeKey');

要根据数据值隔离$（'。hole'），您可以执行以下操作：

var testVal=1; $('.hole[data-hole-key="'+ testVal+'"]').hover(.....

使用filter（）
的另一种方法
var testVal=1; $('.hole').filter(function(){ return $(this).data('data-hole-key')==testVal; }).hover(....

Answer 2

这是我认为你正在寻找的工作方式： http://jsfiddle.net/XKs4a/

// on elements with class "hole" hovered
$('.hole').hover(
    function(){
        // get the data value of the currently hovered element
        var holeKey = $(this).data('holeKey');
        // on all elements with that class "hole" and specified data value, change bgcolor
        $('.hole[data-hole-key=' + holeKey + ']').css({"background":"black"});
    },
    function(){
        var holeKey = $(this).data('holeKey');
        $('.hole[data-hole-key=' + holeKey + ']').removeAttr('style');
    }
);

为此：

var holeKey = $($(this).data('holeKey'));

这将返回包含在jquery中的密钥，因此对于第一个元素，您将得到$（1）

jQuery选择器疯狂

2 个答案: