Javascript问题：在HTMLInputElement.oninput上未定义thisRate

Question

我试图设计一个非常简单的计算器来根据投资额计算比率。错误消息是：

thisRate未在HTMLInputElement.oninput上定义

这是我的代码：

<!-- <form oninput="amout.value = (principal.valueAsNumber * rate.valueAsNumber) /100 " style = "font-family: Arial, Helvetica, sans-serif;"></form> -->

<fieldset>
    <legend>calculate</legend>

    <label for="principal">amout to invest:$</label>
    <input type="number" min="0" max="2000" id="principal" value="10000">

    <p><label for="rate">interest rate</label></p>
    <input id="rate" type="range" min="0" max="20" value="0" oninput="thisRate.value = rate.value">

    <output name="thisRate" for="rate">0</output><span>%</span>

    <p>
        interest received<strong>$<output name="amount">0</output></strong>
    </p>
</fieldset>

<< img src =“ https://image.soinside.com/eyJ1cmwiOiAiaHR0cHM6Ly9pLnN0YWNrLmltZ3VyLmNvbS9PcDFlQS5wbmcifQ==” alt =“在此处输入图像描述”>

Answer 1

尝试一下

var rate = document.getElementById("rate");
rate.oninput = ()=>{
 let value = rate.value; 
}

或

 var rate = document.getElementById("rate");
    rate.onchange = ()=>{
     let value = rate.value; 
    }