javascript - 获取 vanilla JS 中选择元素的前一个(初始)和所选值

Question

我想在一个事件监听器中检索选择元素的初始值和选定值。

我试图伪造一些东西，但它给出了两次第二个值。任何建议将不胜感激。

HTML:

<span class="curr__parent">
  <select class="add__currency">
    <option value="HUF" selected>HUF</option>
    <option value="EUR">EUR</option>
  </select>
</span>

JS:

 document.querySelector('.curr__parent').addEventListener("change",changeCurrenc);
    var changeCurrency = function(event){
    var firstCurr = document.querySelector(".add__currency").value;
    var secondCurr = event.target.value;

    console.log(firstCurr);
    console.log(secondCurr);
    };`

非常感谢，萨比

Answer 1

您必须将初始值存储在事件处理程序范围之外，因为它只会在值更改后触发。

 document.querySelector('.add__currency').addEventListener("change", function(e){
   changeCurrency(e);
 });

var firstCurr = document.querySelector(".add__currency").value;

var changeCurrency = function(event){
    console.log('firstCurr:', firstCurr);

    var secondCurr = event.target.value;
  
    console.log('secondCurr:', secondCurr);
    firstCurr  = secondCurr;
};

<span class="curr__parent">
  <select class="add__currency">
    <option value="HUF" selected>HUF</option>
    <option value="EUR">EUR</option>
    
  </select>
</span>