使用JavaScript/jQuery在鼠标悬停上显示元素的ID

我一直想弄明白这一点，但我还没有。使用JavaScript/jQuery在鼠标悬停上显示元素的ID

我在锚定标记的html中构建列，我想知道将鼠标悬停在其上的那个ID。

它应该很简单，但看起来像我碰壁了，我看不出如何解决这个问题。

我遇到的问题是，在控制台上显示的ID始终是数组的最后一个ID。而不是我想要的特定主播的ID。

任何建议都非常欢迎。

这里是我的代码：

//Anchor builder 
var numberOf = flatParamDateArray.length; 

for (i = 0; i < numberOf; i++) { 
    var param2Slider = document.createElement("a"); 
    param2Slider.id = 'sliderAnchor' + i; 
    sliderAnchorId = param2Slider.id; 
    param2Slider.name = 'param2Slider'; 
    param2Slider.className = 'nav2Slider a'; 
    document.getElementById('nav2Slider').appendChild(param2Slider); 
    $('.nav2Slider a').onmouseover = function() { 
     console.log('flatParamDateArray index: ' + param2Slider.id); 
    } 
}

来源

2013-02-07 Probandot

你的html是什么？部分问题是在jQuery对象中使用纯JavaScript事件。它看起来也比它所需要的复杂得多。 –

我正在使用这个与jQuery插件做一个动画与图像。我已经有一个锚点列可以与一个动画一起工作。但用户可以选择两个选择两个动画，所以我实现了一个控制动画的锚点列。这就是为什么我从'numberOf'创建锚点，这是来自一个动画的图片数量。我想使用鼠标悬停来调用对应于锚点ID的图像。 – Probandot

这是如何告诉我你的html是什么样的，并显示相关的代码。这里 –

移动这个出，并后for for循环：

$('.nav2Slider a').onmouseover = function() { console.log('flatParamDateArray index: '+param2Slider.id); }

2.更改onmouseover()到mouseover()：

$('.nav2Slider a').mouseover(function() { console.log('flatParamDateArray index: '+param2Slider.id); });

要获得ID，这是你需要的代码：

console.log('flatParamDateArray index: '+ $(this).prop('id'));

奖励：

既然你正在动态添加链接，您应该使用.on()函数，以减少e （而不是每个元素）：

$('.nav2Slider').on('mouseover', 'a', function() { console.log('flatParamDateArray index: '+ $(this).prop('id')); });

来源

2013-02-07 10:11:07

请注意，即使没有授权，也可以使用“on”。 '（“。”nav2Slider a“）。on（”mouseover“，function（）{...}）' –

是的，但存在性能问题，尤其是对于许多动态链接。看到这篇文章：[你的jquery-now-with-less-suck]（http://24ways.org/2011/your-jquery-now-with-less-suck/）>事件委托> [jquery-event-代表团]（http://jsperf.com/jquery-event-delegation） –

这个小提琴不测量实际触发的事件的性能。增加它们的成本是IMO，可以忽略不计。我仍然同意，代表团往往是一个好主意。 –

你的变量param2Slider是全球和for循环变化对每个循环的价值。这意味着循环结束后param2Slider只包含最后一个值。

试试这个：

$('.nav2Slider a').on('onmouseover', function() { 
    console.log('flatParamDateArray index: ' + $(this).attr('id')); 
});

编辑：的onmouseover ......当然&你应该将这个片段圈外

来源

2013-02-07 10:10:44 AvL

AvL感谢您的回答，并解释为什么我始终获得相同的价值。我选择塞缪尔的答案，因为它有更多的细节，并帮助我更好地了解如何解决问题。它有.on奖励:) – Probandot

这很公平，因为他解释得更好 - 并且首先付出了更多的关注;-) – AvL

使用JavaScript/jQuery在鼠标悬停上显示元素的ID

回答

相关问题