Question

我有一张桌子，当我点击一个单元格时，该单元格变得可编辑。如果我更改单元格的内容，我想执行AJAX请求以将数据保存到数据库，仅在以下情况下：

焦点离开牢房
按enter键

问题是如果我按下＃34;输入＆＃34;该事件将被执行两次。如果我专注于细胞，那就一次;而且我想我知道为什么：输入按键也有资格作为焦点。这是代码：

$(document).on('focusout keypress', '.row_data', function(event){..}

我试图在事件中限制它：

if ( (event.type === "keypress" && event.which === 13) || (event.type === "focusout" && event.which !== 13) ) {...}

但不幸的是，它不起作用。

知道为什么会失败吗？知道我怎么能让它发挥作用吗？

提前致谢！

Answer 1

如何添加标志以查看此事件是否在再次触发之前已经触发了？

$(document).on('focusout keypress', '.row_data', function(event){
    if ($(this).data('has-event-fired') {
        // Event already fired! Reset our flag and bail!
        $(this).data('has-event-fired', false);
        return;
    }

    // First time we're firing here. Set our flag and fire event as normal.
    $(this).data('has-event-fired', true);

    // Rest of event handler
}

这应该强制你的事件每个动作只触发一次，并在两个事件触发后重置。如果只有一个事件可以解雇，它可能会变得很糟糕，但是值得一试。

Answer 2

尝试将event.stopPropagation();添加到您的回调函数中，然后只收听焦点

$('td').on('focusout', '.row_data', function(event){
    event.stopPropagation();
}

Answer 3

event.preventDefault（）可以停止控制此默认行为，您可以相应地检查条件。

jQuery：绑定2个事件并只执行一个事件

3 个答案: