Javascript 获取已在keydown上悬停的元素的属性

我有一个带有

数据id

属性的

元素。将鼠标悬停在行内的

上，然后按住

ctrl

，我希望从

中获取

数据id

，并更改背景颜色

我希望当用户按住

ctrl

并已将鼠标悬停在

中的

上时触发此事件，但是我无法找到一种有效的方法

如果用户按住control键，然后将鼠标悬停在

上，则此操作有效：

我已尝试使用以下插件检查鼠标在单击

ctrl

时是否悬停在

上：

    (function ($) {
    $.fn.isMouseOver = function () {
        return $(this).parent().find($(this).selector + ":hover").length > 0;
    };
})(jQuery);
$(document).on("keydown", function (e) {
    if ($('.sigData').isMouseOver()) {
        var id = $(this).parent().data("id");
        $(this).parent().addClass("danger");
        //AJAX request with id
    }
})

当打开引导模式时，

通过AJAX请求中的JavaScript动态添加。 示例输出：

<tr data-id="8">
    <td class="sigData"><span rel="tooltip" title="John Doe">1275302</span></td>
    <td class="sigData">11/26/2015</td>
    <td class="sigData">Yes</td>
</tr>

1275302
11/26/2015
对

编辑1（11/29） 出于某种原因，我认为

$.addClass（）

将速度作为一个参数。远离的。 为了澄清，AJAX请求使用了

$（this）.parent（）.data（“id”）

。更新

---

JSFIDLE示例已更新。

尝试删除参数之间的逗号

，

，以

.addClass（）

---

jsiddle

您应该记住最后输入的行a变量，以便在随后处理

CTRL

key down事件时具有引用。离开行时，应取消设置引用

我的示例使用来避免冗长的

if

-

else

语句

// will be set on mouseenter, unset on mouseleave
// (can be used in subsequent keyevent)
var lastRow = null;
$(document).on({
    mouseenter: function (e) {
        var row = $(this).parent();
        var id = row.data("id");

        // remember row for later key event
        lastRow = row;

        if (e.ctrlKey) {
            row.addClass("danger");
        }

        // AJAX request with id
    },

    mouseleave: function () {
        lastRow.removeClass("danger");
        // unset the reference, since we're leaving the cell (and thus potentially changing the row)
        lastRow = null;
    }
}, ".sigData");

$(document).on("keydown", function (e) {
    if (!lastRow || !e.ctrlKey) {
        // no row hovered recently or no CTRL key pressed
        return;
    }

    lastRow.toggleClass("danger", e.ctrlKey);

    var id = lastRow.data("id");
    //AJAX request with id
});

---

请参阅（由bnahin本人提供：）

当用户按住

ctrl

并将鼠标悬停在上方时，此功能将起作用。我希望在用户已将鼠标悬停在

上并按住

ctrl

时触发事件。这正是我要查找的内容。非常感谢。

$(document).on({
    mouseenter: function (e) {
        if (e.ctrlKey) {
            var row = $(this).parent();
            var id = row.data("id");
            console.log("mouseenter", id)
            row.addClass("danger fast");
        }
    },
    mouseleave: function () {
        var row = $(this).parent();
        var id = row.data("id");
        row.removeClass("danger fast");
        console.log("mouseleave", id)
    }
}, ".sigData"); //pass the element as an argument to .on
$(document).on("keydown", function (e) {
    if ($('.sigData').isMouseOver()) {
        var id = $(this).parent().data("id");
        console.log("keydown", id)
        $(this).parent().addClass("danger fast");
    }
});

// will be set on mouseenter, unset on mouseleave
// (can be used in subsequent keyevent)
var lastRow = null;
$(document).on({
    mouseenter: function (e) {
        var row = $(this).parent();
        var id = row.data("id");

        // remember row for later key event
        lastRow = row;

        if (e.ctrlKey) {
            row.addClass("danger");
        }

        // AJAX request with id
    },

    mouseleave: function () {
        lastRow.removeClass("danger");
        // unset the reference, since we're leaving the cell (and thus potentially changing the row)
        lastRow = null;
    }
}, ".sigData");

$(document).on("keydown", function (e) {
    if (!lastRow || !e.ctrlKey) {
        // no row hovered recently or no CTRL key pressed
        return;
    }

    lastRow.toggleClass("danger", e.ctrlKey);

    var id = lastRow.data("id");
    //AJAX request with id
});