更改输入的输入值，而不影响更改侦听器？

Question

我有一个文字输入。它有一个change和一个input侦听器。在input侦听器中，如果是“delete”，则删除输入的值。 change监听器只会提醒“已更改。”。

当前行为：

没有“改变”。当我输入“删除”并停止编辑时发出警报，因为比较基数也会改变。

所需行为

我想看到“改变了”。根据编辑开始时的值发出警报，忽略修改期间所做的所有程序更改。

这样做最简单的方法是什么？

Playgorund：

1. 点击输入。
2. 删除内容。
3. 输入“删除”。
4. 查看文本的删除方式。
5. 点击其他地方。
6. 看看“改变了”。警告不显示。

var input = document.querySelector('input');

input.addEventListener('change', function() {

  alert('Changed.');

});

input.addEventListener('input', function() {

  input.value = input.value.replace(/^delete$/, '');

});

<input value="example" />

Answer 1

我目前的解决方案是添加一个属性，我将初始值存储在每个focus事件中，并将其与blur事件时的当前值进行比较。

＆＃13;

＆＃13;

var input = document.querySelector('input');

input.addEventListener('focus', function() {

  this.setAttribute('data-value-on-focus', this.value);

});

input.addEventListener('blur', function() {

  if (this.getAttribute('data-value-on-focus') !== this.value) alert('Changed.');

});

input.addEventListener('input', function() {

  this.value = this.value.replace(/^delete$/, '');

});

＆＃13;

<input value="example" />

＆＃13;

＆＃13;

＆＃13;