Javascript oninput（setTimeout 2s）/onchange-fire首先出现

嗨，我有一个保存函数，它在更改事件或2s超时后输入时触发。 问题是，在这种情况下，函数保存会触发两次：

打字

等2秒

oninput激发保存事件

在输入之外单击

onchange激发保存事件

我只需要保存一次，这取决于首先发生的事情。若用户键入某个内容并立即离开输入，则应取消通过onchange保存和oninput超时。但是，如果键入某个内容并等待2秒，则不应触发通过oninput和onchange进行保存

我需要一些简单干净的解决方案。它存在吗？谢谢：）

编辑： 这是我的密码

---

您可以设置一个标志来指示是否需要保存：

jQuery('#text').on('change', function() {
    save();
});

jQuery('#text').on('input', function(){
    jQuery(this).data('unsaved', true);
    clearTimeout(this.delayer);

    var context = this;
    this.delayer = setTimeout(function () {
        jQuery(context).trigger('change');
    }, 2000);
});

function save(){
    if (jQuery('#text').data('unsaved')) {
        jQuery('#a').text('saved on ' + new Date().getTime());
        jQuery('#text').data('unsaved', false);
    }
}

演示：

更新：如果您需要处理其他JavaScript函数对字段值的更改，您可以执行以下操作（保留原始的

'change'

和

'input'

处理程序：

function save(){
    var $text = jQuery('#text');
    if ($text.data('prevVal') != $text.val()) {
        jQuery('#a').text('saved on ' + new Date().getTime());
        $text.data('prevVal', $text.val());
    }
}

也就是说，仅当字段的当前值与上次保存的值不同时才进行保存（因为以前没有保存值，所以第一次保存时会自动不同）

---

演示：

您可以设置一个标志来指示是否需要保存：

jQuery('#text').on('change', function() {
    save();
});

jQuery('#text').on('input', function(){
    jQuery(this).data('unsaved', true);
    clearTimeout(this.delayer);

    var context = this;
    this.delayer = setTimeout(function () {
        jQuery(context).trigger('change');
    }, 2000);
});

function save(){
    if (jQuery('#text').data('unsaved')) {
        jQuery('#a').text('saved on ' + new Date().getTime());
        jQuery('#text').data('unsaved', false);
    }
}

演示：

更新：如果您需要处理其他JavaScript函数对字段值的更改，您可以执行以下操作（保留原始的

'change'

和

'input'

处理程序：

function save(){
    var $text = jQuery('#text');
    if ($text.data('prevVal') != $text.val()) {
        jQuery('#a').text('saved on ' + new Date().getTime());
        $text.data('prevVal', $text.val());
    }
}

也就是说，仅当字段的当前值与上次保存的值不同时才进行保存（因为以前没有保存值，所以第一次保存时会自动不同）

---

演示：

你不能添加一个数据属性，比如数据已经更改并检查它吗？

你不能添加一个数据属性，比如数据已经更改并检查它吗？

老实说，我能想到的唯一解决方案是初始化一个全局布尔变量，该变量指示save hapen

var hasSaveHapen = false;

现在，当这些函数中的任何一个尝试保存时，请使用以下命令：

if(!hasSaveHapen){
   do your save action
   hasSaveHapen = false;
}

---

老实说，我能想到的唯一cleen解决方案是初始化表示save-hapen的全局布尔变量

var hasSaveHapen = false;

现在，当这些函数中的任何一个尝试保存时，请使用以下命令：

if(!hasSaveHapen){
   do your save action
   hasSaveHapen = false;
}

---

这可能会起作用。但我还有另一个问题。如果我通过javascript更改输入值，然后触发onchange事件，它将不会调用save方法，因为flag。好的，请参阅我的更新，这可能是更好的选择，因为它只需要在

save（）中进行更改

函数，不在原始事件处理程序中。这可能会起作用。但我有另一个问题。如果我通过javascript更改输入值，然后触发onchange事件，它将不会调用save方法，因为有标志。好的，请参阅我的更新，这可能是更好的选择，因为它只需要在

save（）中进行更改

函数，不在原始事件处理程序中。