js change方法获取旧值

在JavaScript中，change事件监听器函数可以通过访问事件对象来获取旧值。在事件对象中，有一个属性叫做target，它代表触发事件的元素，还有一个属性叫做oldValue，它代表元素值变化前的旧值。

例如，我们可以监听一个input元素的change事件，并获取它的旧值和新值，代码如下：

var inputElement = document.getElementById("myInput");
var oldValue;

inputElement.addEventListener("change", function(event) {
  console.log("旧值：" + oldValue);
  console.log("新值：" + event.target.value);
  oldValue = event.target.value;
});

在上面的代码中，我们定义了一个变量oldValue，用于存储上一次input元素的值。在change事件监听器函数中，我们首先通过访问事件对象的target属性获取到input元素，然后通过访问事件对象的oldValue属性获取到元素值变化前的旧值。最后，我们将新值赋值给oldValue，以备下一次change事件使用。

需要注意的是，oldValue属性只在一些特定的输入元素上才有定义，例如input、textarea和contenteditable元素。对于其他元素，可能需要使用其他方法来获取旧值。

相关问题

el-input-number change 方法 怎么取改变之前的值

在Element UI的`el-input-number`组件中，当你需要获取输入框内容的变化并记录下改变前的值时，你可以通过监听`change`事件并在该事件处理函数中保存原始值。以下是基本的步骤：

1. 首先，在你的Vue实例中声明一个数据属性来存储原始值，例如`originalValue`。

data() {
  return {
    originalValue: '',
    // 其他数据...
  };
}

2. 然后，给`el-input-number`添加`change`事件处理器，并在这个函数中更新`originalValue`和当前输入值。

<el-input-number v-model="value" @change="handleInputChange"></el-input-number>

<script>
methods: {
  handleInputChange(newValue) {
    this.originalValue = this.value; // 保存当前值作为原始值
    // 进行其他业务处理...
  }
}
</script>

现在，每当`el-input-number`的值发生变化时，`originalValue`就会自动更新为旧值。如果需要在任何时候查看原始值，可以随时从数据对象中访问`this.originalValue`。

这时候selectedValues的值已经变化了，获取不到之前的旧值的

当你在`change`事件处理程序中直接修改`selectedValues`的时候，由于事件处理程序是在异步执行的，实际上`selectedValues`已经被新的值覆盖，所以在事件回调内无法直接获取到之前的旧值。为了避免这种情况，你可以考虑采用以下策略：

1. **深度复制**：如前所述，在事件处理函数开始时先对`selectedValues`做一次深度复制，例如使用`JSON.parse(JSON.stringify(selectedValues))`。

2. **临时变量存储**：创建一个单独的变量存储旧值，比如`prevSelectedValues`，并在事件开始前将当前值赋给它。

handleChange(event) {
  const prevSelectedValues = this.selectedValues.slice(); // 使用数组的slice方法创建浅拷贝
  // ... 然后继续处理新值
}

使用`slice()`方法可以创建一个新的数组，包含原数组的所有元素，这样就不会影响原始值。

3. **使用闭包**：如果你的项目支持ES6，可以利用闭包来保存旧值。

handleChange(event) {
  (function保存旧值() {
    this.prevSelectedValues = this.selectedValues;
  }).call(this); // 在事件处理函数中立即执行并保存旧值
  // ... 然后处理新值
}

在这种情况下，即使在事件处理程序结束后，`prevSelectedValues`仍然保留了原始值。