在提交html后计算表单的文本框值
在提交html后计算表单的文本框值
提问于 2017-03-31 05:42:08
我正在设计一种表格。它接受输入，并在单击计算后给出输出。文本字段“State”只接受两个大写字母
我被困在创建计算按钮。
“计算”按钮需要确定客户行驶的里程数和客户应支付的总费用。
以下是我的表格：
function ValidateData() {
var InputText = document.getElementById('state').value;
var Expression = /^[zA-Z]*$/
if (InputText.search(Expression) == -1) {
alert("Must contain only A-Z");
return false;
}
}body {
background-color: powderblue;
}
.upper {
text-transform: uppercase;
}<!DOCTYPE html>
<html>
<head><b>Calculate Rental Charges</b></head><br>
<body>
<form action="/action_page.php">
First name:<br>
<input type="text" name="firstname" value="">
<br> Address:
<br>
<input type="text" name="address" value="">
<br> city:
<br>
<input type="text" name="city" value="">
<br> State:
<br>
<input type="text" id="state" name="State" cssclass="upper" value="">
<br> Zip code:<br>
<input type="text" name="zipcode" value="">
<br> Beginning odometer reading(in miles):<br>
<input type="text" name="zipcode" value="">
<br> Ending odometer reading(in miles):<br>
<input type="text" name="zipcode" value="" maxlength="10">
<br>
<br>
<input type="submit" value="Submit" OnClientClick="return ValidateData()">
</form>
我设计了一个脚本来验证状态应该只有大写字母。
我想计算不。行驶里程，这可以通过得到不同的起始里程和终点里程来实现。 我必须用一个常数来计算每天15美元的费用和0.12美元的里程率。
是否有任何方法来获得所有这些结果单次点击提交按钮。
回答 1
Stack Overflow用户
发布于 2017-03-31 06:36:32
我创建了两个输入字段，一个用于存储总距离，另一个用于存储成本。两人都是残疾人。
添加一个按钮来计算。
然后添加这样的函数并按一下按钮调用它。
function calc(){
var totalMile = parseInt(document.getElementsByName("endMile")[0].value)-parseInt(document.getElementsByName("startMile")[0].value)
document.getElementById("result").value=totalMile;
var cost=(totalMile*0.12)+15
document.getElementById("cost").value='$'+cost;
}
function ValidateData() {
var InputText = document.getElementById('state').value;
var Expression = /^[A-Z]*$/
if (InputText.search(Expression) == -1) {
alert("Must contain only A-Z");
return false;
}
}
function calc(){
var totalMile = parseInt(document.getElementsByName("endMile")[0].value)-parseInt(document.getElementsByName("startMile")[0].value)
document.getElementById("result").value=totalMile;
var cost=(totalMile*0.12)+15
document.getElementById("cost").value='$'+cost;
}body {
background-color: powderblue;
}
.upper {
text-transform: uppercase;
}<!DOCTYPE html>
<html>
<head><b>Calculate Rental Charges</b></head><br>
<body>
<form method="post" action="/action_page.php">
First name:<br>
<input type="text" name="firstname" value="">
<br> Address:
<br>
<input type="text" name="address" value="">
<br> city:
<br>
<input type="text" name="city" value="">
<br> State:
<br>
<input type="text" id="state" name="State" cssclass="upper" value="">
<br> Zip code:<br>
<input type="text" name="zipcode" value="">
<br> Beginning odometer reading(in miles):<br>
<input type="text" name="startMile" value="">
<br> Ending odometer reading(in miles):<br>
<input type="text" name="endMile" value="" maxlength="10">
<br>
<button type="button" onclick="calc();">Calc</button>
<br />
Total Miles : <br />
<input disabled id="result" />
<br />
Total Cost <br />
<input disabled id="cost" />
<br />
<br>
<input type="submit" value="Submit" Onclick="return ValidateData();">
</form>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/43133207
复制相关文章
相似问题
腾讯云开发者
