＆lt; select＆gt;选项取决于另一个选项的选项＆lt; select＆gt;菜单

Question

最近，我开始了JavaScript课程，因此我仍在弄清楚如何做最好的事情。我的目标是拥有2个选择菜单，包括相同的货币及其价值，并在彼此之间进行转换。

例如，如果菜单中的欧元从菜单B组合在一起，则为1 *1。美元将为1 * 1.06，依此类推，但这仅允许我从欧元转换为其他东西。

我试图通过循环弄清楚这是否可以。那会以某种方式工作吗？

编辑： 在Mstephen19给出的HTML中，我表明了一个不知道如何使用这2个下降箱转换多种货币的问题。

//jquery-3.6.0.min.js

const inputValue = Number(document.getElementById("inputVal").value);

console.log(selectedText);
console.log(selectedText2);

function getResult(){
const selectedText = $('#menuA :selected').text();
const selectedText2 = $('#menuB :selected').text();
let result;
if (selectedText === 'option1' && selectedText2 === 'option1'){
        result = inputValue * 1;
        console.log(result);
    } else if (selectedText === 'option1' && selectedText2 === 'option2'){
        result = inputValue * 0.1;
        console.log(result);
    } else if (selectedText === 'option1' && selectedText2 === 'option3'){
        result = inputValue * 0.01;
        console.log(result);
    } else if (selectedText === 'option2' && selectedText2 === 'option1'){
        result = inputValue * 5;
        console.log(result);
    }
    document.getElementById('resultbox').value = result;
}

<form>
    <input name="number" type="number" />

    <select name="first" id="first">
        <option value="1">EUR</option>
        <option value="1.06">USD</option>
        <option value="1.37">CAD</option>
    </select>

    <select name="second" id="second">
        <option value="1">EUR</option>
        <option value="1.06">USD</option>
        <option value="1.37">CAD</option>
    </select>
</form>

<div id="resultBox"></div>

Answer 1

我不确定如何计算这些乘数（1，5，0.5等）做一堆If ...其他语句。

const form = document.querySelector('form');
const resultBox = document.querySelector('div#resultBox');

const handleChange = () => {
    // Grab the data from the form
    const data = Object.fromEntries([...new FormData(form)]);

    // If input number is NaN, just do nothing
    if (isNaN(+data.number)) return;

    // Calculate what the multiplier should be
    const multiplier = +data.first * +data.second;

    // Calculate the result
    const result = data.number * multiplier;

    resultBox.textContent = result.toFixed(2);
};

// Run the function every time the form is changed,
// or the input changes
form.addEventListener('change', handleChange);
form.addEventListener('keyup', handleChange);

<form>
    <input name="number" type="number" />

    <select name="first" id="first">
        <option value="1">Option One</option>
        <option value="5">Option Two</option>
        <option value="10">Option Three</option>
    </select>

    <select name="second" id="second">
        <option value="1">Option One</option>
        <option value="0.1">Option Two</option>
        <option value="0.01">Option Three</option>
    </select>
</form>

<div id="resultBox"></div>