为什么函数触发时输入值没有改变

Question

我正在编写一个单位转换器，它的工作是将给定的秒数转换为用户使用的单位。转换系统工作完美，但问题来了：当用户在其中输入数字时，输入的值不会改变。我不明白问题出在哪里。

HTML：

<body>
    <select class="select">
        <option value="second">second</option>
        <option value="minute">minute</option>
        <option value="hour">hour</option>
        <option value="day">day</option>
    </select>
    <input class="inp" type="text">
    <p class="p"></p>
    <script src="Untitled-1.js"></script>
</body>

JS：

let select = document.querySelector(".select")
let userAmountInput = document.querySelector(".inp")
let p = document.querySelector(".p")

let array = [
    {
    name:"second",
    second: userAmountInput.value * 1,
    minute: userAmountInput.value / 60,
    hour: userAmountInput.value / 3600,
    day: userAmountInput.value / 86400,
},
            ]

function updateP(e) {
    if (e.key == "Enter") {
        let x = select.value
        p.innerHTML = array[0][x]
        console.log(array[0][x])
    }
}
userAmountInput.addEventListener("keyup",updateP)

Answer 1

```
select.value
```
不保存该值，您应该使用事件：
```
event.target.value
```
```
array
```
毫无意义，让我们改变一下：
1. 对于包含函数的对象
2. 获取所选类型的功能
3. 使用当前输入值调用函数

let select = document.querySelector(".select")
let userAmountInput = document.querySelector(".inp")
let p = document.querySelector(".p")

const converters = {
    second: (n) => n * 1,
    minute: (n) => n / 60,
    hour:   (n) => n / 3600,
    day:    (n) => n / 86400
};

function updateP(e) {
    if (e.key == "Enter") {
    
        if (!converters[select.value]) {
            console.error('No converter found for', select.value);
            return;
        }
        
        let x = +e.target.value;
        let y = converters[select.value];
        console.log(1, x, select.value);
        p.innerHTML = y(x);
    }
}
userAmountInput.addEventListener("keyup",updateP)

<body>
    <select class="select">
        <option value="second">second</option>
        <option value="minute">minute</option>
        <option value="hour">hour</option>
        <option value="day">day</option>
    </select>
    <input class="inp" type="text">
    <p class="p"></p>
    <script src="Untitled-1.js"></script>
</body>

为什么函数触发时输入值没有改变

问题描述投票：0回答：1

1个回答

最新问题

为什么函数触发时输入值没有改变

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1