Question

我有div标签（id = div_1），这个标签有几个邻居元素，在这个标签上的moseout之后，鼠标已经在其他元素上了吗？我想在div_1标签上的onmouseout上，提醒id元素，现在鼠标悬停，怎么做？

<div id="div_1" style="width: 100px; height: 100px; background-color: #090"></div>
<div id="div_2" style="width: 100px; height: 100px; background-color: #900"></div>

Answer 1

<强>更新

在评论中，你说

我需要id其他元素，现在是鼠标

这是一个不同的问题。要做到这一点，你需要知道鼠标离开div，和知道它已经输入了其他内容。我可能会使用mouseleave和mouseover的组合，如下所示：

$("#div_1").mouseleave(function() {
    // We're leaving the div, set up to capture mouseover
    $("....selector for a container of these elements...").one("mouseover", function(e) {
        // Get the ID of the bottommost element
        console.log(e.target.id);

        // Or alternately, in case it doesn't have one
        var elementWithID = $(e.target).closest('[id]');
        if (elementWithID[0]) {
            console.log(elementWithID[0].id);
        }
    });
});

但我真的很难想出一种不同的方式来提供基本要求。

原始答案：

简短版本：

$("#div_1").mouseout(function() {
    alert(this.id); // But I'd avoid alert if I were you, perhaps console.log?
});

但请继续阅读...

长版：

当您使用jQuery设置事件处理程序时，调用处理程序时，this是对您挂接事件的DOM元素的引用，当然id是反射属性id属性。

但请记住mouseout 起泡，因此每当鼠标离开mouseout（任何一个）内的元素时，您都会收到div事件它的后代），即使它没有离开div本身。如果您只是想知道它何时离开div但不知道它的任何后代元素，请改用mouseleave（最初只使用IE浏览器，但jQuery提供跨浏览器）。

如果你想将其推广到所有具有类foo的div：

$("div.foo").mouseout(function() { // Or, of course, mouseleav
    console.log(this.id);
});

Answer 2

这是你想要的吗？

<强> HTML

<div id="container">
    <div id="1">1</div>
    <div id="2">2</div>
</div>

<强>的JavaScript

$('#container > div').mouseover( function() {
    alert ($(this).attr('id'));
});

<强>演示

http://jsfiddle.net/CFtP5/

修改

不使用父元素选择子元素时。只需使用通配符，就像这样：

<强>的JavaScript

$("[id^=div]").mouseover (function() { alert ($(this).attr('id')); });

<强> HTML

<div id="div_1">1</div> <div id="div_2">2</div> <div id="div_3">3</div>

<强>样本

http://jsfiddle.net/VPm8M/

使用onmouseover，onmouseout进行操作

2 个答案: