Question

我的单位转换器有问题。我希望它在每次按键后立即执行convert()功能。 keyup和keydown仅在按回车键或在其他位置单击鼠标后才能工作。我希望它可以像GTranslator一样同时工作。

JS

var text;
var number;
var index;
var index2;

const test = document.getElementById("userInputNumber");
test.addEventHandler("keypress", convert);


function convert() {
    text = document.getElementById("userInputNumber").value;
    number = parseFloat(text);
    determineUnit();
    convertUnit();
    document.getElementById("result").value = number;
}

function determineUnit() {
    index = document.getElementById("mySelect1").selectedIndex;
    if (index === 0) {
    number = number * 1000;
    } else if (index === 1) {
        number = number * 1;
    } else if (index === 2) {
        number = number * 0.01;
    } else {
        number = number * 0.001;
    }
}

function convertUnit() {
    index2 = document.getElementById("mySelect2").selectedIndex;
    if (index2 === 0) {
    number = number * 0.001;
    } else if (index2 === 1) {
        number = number * 1;
    } else if (index2 === 2) {
        number = number * 100;
    } else {
        number = number * 1000;
    }
}

    document.getElementById("Reset").reset();

HTML

<form id="converter" onsubmit="return false"> 

        <input type="text" id="userInputNumber">

        <select id="mySelect1">
            <option value="kilometers">Kilometers</option>
            <option value="meters" selected>Meters</option>
            <option value="centimeters">Centimeters</option>
            <option value="millimeters">Millimeters</option>
        </select>

        <input type="text" id="result" disabled>

        <select id="mySelect2">
            <option value="kilometers">Kilometers</option>
            <option value="meters">Meters</option>
            <option value="centimeters">Centimeters</option>
            <option value="millimeters">Millimeters</option>
        </select>

      <button class="convertButton" onclick="convert()">Convert</button>

      <input type="reset" value="Reset">

    </form>

Answer 1

好吧，我发现的最佳解决方案是在HTML中使用onkeydown="convert()"，并且除第一个数字外，此方法运行得很好，当我键入一个数字时，输出结果却是NaN。当我按回车键时，它会转换，当我继续输入更多数字时，它就像魔术一样工作。我不明白为什么程序无法将第一个字符串转换为数字。

Answer 2

我建议的解决方案是使用KeyPress

document.addEventListener('keypress', convert);

function convert(e) {
  //Your Code Here
}

如果您要检查用户按下了什么键，可以在转换函数中使用此$ {e.code} ;。

如何在每次按键后立即执行功能

2 个答案: