function CalcVolume() {
var radiusvalue = document.getElementById("radius").value
if (radiusvalue) {
if (isNaN(radiusvalue)) {
alert("Provide a number")
return;
}
volumevalue = 4 * 3.14 * radiusvalue * radiusvalue * radiusvalue
document.getElementById("volume").value = volumevalue;
} else {
alert("Provide an input")
}
}
form {
border: 2px solid black;
padding-left: 15px;
height: 170px;
width: 200px;
}
<form>
<p>
Radius<br>
<input type="text" id="radius">
</p>
<p>
Volume<br>
<input type="text" id="volume">
</p>
<button onclick="CalcVolume()">Calculate</button>
</form>
在上面的代码段中,这是一个带有 UI 的小逻辑,用于计算给定半径的体积,单击带有文本“计算”的按钮时会自动清除文本字段。有人可以帮助我理解这一点吗?
最佳答案
form
已提交。
您可以添加onsubmit="return false;"
至<form onsubmit="return false;">
堆栈片段
function CalcVolume() {
var radiusvalue = document.getElementById("radius").value
if (radiusvalue) {
if (isNaN(radiusvalue)) {
alert("Provide a number")
return;
}
volumevalue = 4 * 3.14 * radiusvalue * radiusvalue * radiusvalue
document.getElementById("volume").value = volumevalue;
} else {
alert("Provide an input")
}
}
form {
border: 2px solid black;
padding-left: 15px;
height: 170px;
width: 200px;
}
<form onsubmit="return false;">
<p>
Radius<br>
<input type="text" id="radius">
</p>
<p>
Volume<br>
<input type="text" id="volume">
</p>
<button onclick="CalcVolume()">Calculate</button>
</form>
或者替换 form
带有 div
的元素
堆栈片段
function CalcVolume() {
var radiusvalue = document.getElementById("radius").value
if (radiusvalue) {
if (isNaN(radiusvalue)) {
alert("Provide a number")
return;
}
volumevalue = 4 * 3.14 * radiusvalue * radiusvalue * radiusvalue
document.getElementById("volume").value = volumevalue;
} else {
alert("Provide an input")
}
}
.myform {
border: 2px solid black;
padding-left: 15px;
height: 170px;
width: 200px;
}
<div class="myform">
<p>
Radius<br>
<input type="text" id="radius">
</p>
<p>
Volume<br>
<input type="text" id="volume">
</p>
<button onclick="CalcVolume()">Calculate</button>
</div>
关于javascript - 单击按钮时会清除文本字段中的内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49332950/