有人能帮助我如何将正方形和立方体从一个选项更改为两个按钮吗

Question

这是我的代码，有人能告诉我如何将这些按钮变成我可以点击的按钮而不是选项吗？这将非常有帮助。

谢谢

function check() {
//All Variables
var num = parseInt(document.getElementById("n1").value);
var oper = document.getElementById("operator").value;
//If Statements
if (oper === "Sqaure") {
document.getElementById("result").innerHTML = "The square root of " + num + " is " + Math.sqrt(num);
}
if (oper === "Cube") {
document.getElementById("result").innerHTML = "The cube root of " + num + " is " + Math.cbrt(num);
}
}

body {
user-select: none;
}
#btn1 {
cursor: pointer;
}

Number: <input type="text" placeholder="Enter Number" id="n1" /><br>
<select id="operator">
<option value="Sqaure">Square Root</option>
<option value="Cube">Cube Root</option>
</select>
<input type="button" value="Find" onclick="check();" id="btn1" /><br><br>
<p id="result"></p>

Answer 1

删除select字段并添加第二个(按钮(input字段。

两个按钮的onclick属性可以将所需操作传递给check功能。

在check函数中，一切都保持不变——只是不需要检索运算符，因为它现在是函数的参数。

考虑以下实现上述功能的实时片段。它还使用isNan()来检查输入的数据是否是有效的数字，如果不是，则显示一条错误消息。

function check(operation) {
const num = parseInt(document.getElementById("n1").value);
if (isNaN(num)) {
document.getElementById("result").innerHTML = 'Please enter a number';
} else {
let root;
if (operation === "square") {
root = Math.sqrt(num);
} else if (operation === "cube") {
root = Math.cbrt(num);
}
document.getElementById("result").innerHTML = `The ${operation} root of ${num} is ${root}`;
}
}

body {
user-select: none;
}
#btn1 {
cursor: pointer;
}

Number:
<input type="text" placeholder="Enter Number" id="n1">
<p>
<input type="button" value="Square Root" onclick="check('square');" id="btn1">
<input type="button" value="Cube Root" onclick="check('cube');" id="btn2">
</p>
<p id="result"></p>