📅 最后修改于: 2023-12-03 15:11:57.139000 🧑 作者: Mango
在 HTML 中，我们可以通过在 input 标签中添加 onchange 属性来指定当输入框中的值发生改变时要执行的操作。这在很多场景下都是非常有用的，比如用户需要输入某个角度值，我们可以通过 onchange 事件来实时计算正弦、余弦等相关数值。
<!DOCTYPE html>
<html>
<head>
<title>角度输入 onchange 演示</title>
<script type="text/javascript">
function calculate() {
var angle = document.getElementById("angle").value; // 获取输入框的值
var sin = Math.sin(angle * Math.PI / 180); // 计算正弦值
var cos = Math.cos(angle * Math.PI / 180); // 计算余弦值
document.getElementById("sin").innerHTML = sin.toFixed(4); // 显示正弦值
document.getElementById("cos").innerHTML = cos.toFixed(4); // 显示余弦值
}
</script>
</head>
<body>
<label for="angle">请输入角度：</label>
<input type="number" id="angle" onchange="calculate()" />
<p>正弦值：<span id="sin"></span></p>
<p>余弦值：<span id="cos"></span></p>
</body>
</html>
上述代码演示了一个简单的例子，当用户输入一个角度值后，通过 onchange 事件计算该角度的正弦值和余弦值，并在页面上显示。