Question

我有一个:h :l元素，其<tr>属性。将鼠标悬停在该行内的data-id上，然后按住<td>，我希望从ctrl获取data-id并更改背景颜色。

我希望当用户按住<tr>并且已经将鼠标悬停在ctrl中的<td>上时会触发此事件，但我无法找到有效的方法。

如果用户按住控件然后将其悬停在<tr>：

上，则此方法有效

<td>

我尝试使用以下插件检查点击$(document).on({ mouseenter: function (e) { if (e.ctrlKey) { var row = $(this).parent(); var id = row.data("id"); row.addClass("danger"); //AJAX request with id } }, mouseleave: function () { var row = $(this).parent(); row.removeClass("danger"); } }, ".sigData");时鼠标是否悬停在<tr>上：

ctrl

在打开Bootstrap模式时，使用来自AJAX请求的JavaScript动态添加(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 } })。示例输出：

<tr>

JSFiddle Example

编辑1（11/29）

出于某种原因，我认为

<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>

将速度作为参数。删除。为了澄清，$.addClass()用于AJAX请求。更新。

JSFiddle示例已更新。

Answer 1

在处理CTRL按键事件之后，您应该记住最后输入的行是一个变量以获得引用。离开行时，您应该取消设置引用。

我的示例使用toggleClass(classnames, state)来避免使用详细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
});

见JSFiddle（由bnahin亲自提供：）

Answer 2

尝试删除参数之间的逗号.addClass()至$(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"); } });

chart.xAxis[0].update({min:minDate, max:maxDate});

jsfiddle http://jsfiddle.net/yvr0bdt0/4/

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

JSFiddle Example

编辑1（11/29）

2 个答案: