Javascript旅行计算器不起作用

Javascript Travel Calculator not working

本文关键字:不起作用 计算器 旅行 Javascript      更新时间:2023-09-26

我正在尝试制作一个JavaScript计算器,该计算器将计算4个家庭乘火车旅行的费用。一张成人票的费用为32美元,儿童的费用为20美元,佣金为10美元。这是我的JavaScript。当我在Firefox调试器中运行它时,它说未定义amountdue1?

<script language="JavaScript/text">
var child = 20;
var adult = 32;
function amountdue1() {
{
if (document.calc.familyname1.value === null || document.calc.familyname1.value.length === 0) 
{
alert("Please enter your family name");
}
else
{

var numadults = document.calc.num_Adults1.selectedIndex;
var numchildren = document.calc.num_Children1.selectedIndex;
document.calc.totaldue.value = (numadults * adult) + (numchildren * child) + 10; 
}};

此表在正文中。会有 4 个到期金额,但我无法找到一个工作。

<table width=100% border=1 class="one" id="table_one">
<br>
<tr>
<th width=20%>Family One</th>
<th width=20%>Family Two</th>
<th width=20%>Family Three</th>
<th width=20%>Family Four</th>
</tr>
<tr>
<td align=center>
<br>
<input type="text" name="familyname1" maxlength="20"><br>
</td>
<td align=center>
<br>
<input type="text" name="familyname2" maxlength="20"><br>
</td>
<td align=center>
<br>
<input type="text" name="familyname3" maxlength="20">
</td>
<td align=center>
<br>
<input type="text" name="familyname4" maxlength="20"><br>
</tr>
<tr>            
<td align=center><br>
<select id="num_Adults1" onchange="return total1()">
<option value=0 selected>0 Adults</option>
<option value=1>1 Adult</option>
<option value=1>2 Adults</option>
<option value=1>3 Adults</option>
<option value=1>4 Adults</option>
<option value=1>5 Adults</option>
<option value=1>6 Adults</option>
<option value=1>7 Adults</option>
<option value=1>8 Adults</option>
</select>
</td>
<td align=center><br>
<select id="num_Adults2" onchange="return total2()">
<option value=0 selected>0 Adults</option>
<option value=1>1 Adult</option>
<option value=1>2 Adults</option>
<option value=1>3 Adults</option>
<option value=1>4 Adults</option>
<option value=1>5 Adults</option>
<option value=1>6 Adults</option>
<option value=1>7 Adults</option>
 <option value=1>8 Adults</option>
</select>
</td>
<td align=center><br>
<select id="num_Adults3" onchange="return total3()">
<option value=0 selected>0 Adults</option>
<option value=1>1 Adult</option>
<option value=1>2 Adults</option>
<option value=1>3 Adults</option>
<option value=1>4 Adults</option>
<option value=1>5 Adults</option>
<option value=1>6 Adults</option>
<option value=1>7 Adults</option>
<option value=1>8 Adults</option>
</select>
</td>
<td align=center><br>
<select id="num_Adults4" onchange="return total4()">
<option value=0 selected>0 Adults</option>
<option value=1>1 Adult</option>
<option value=1>2 Adults</option>
<option value=1>3 Adults</option>
<option value=1>4 Adults</option>
<option value=1>5 Adults</option>
<option value=1>6 Adults</option>
<option value=1>7 Adults</option>
<option value=1>8 Adults</option>
</select>
</td>
</tr>
<tr>
<td align=center><br>
<select id="num_Children1" onchange="return total1()">
<option value=0 selected>0 Children</option>
<option value=1>1 Child</option>
<option value=1>2 Children</option>
<option value=1>3 Children</option>
<option value=1>4 Children</option>
<option value=1>5 Children</option>
<option value=1>6 Children</option>
<option value=1>7 Children</option>
<option value=1>8 Children</option>
</select>
</td>               
<td align=center>
<br>
<select id="num_Children2" onchange="return total2()">
<option value=0 selected>0 Children</option>
<option value=1>1 Child</option>
<option value=1>2 Children</option>
<option value=1>3 Children</option>
<option value=1>4 Children</option>
<option value=1>5 Children</option>
<option value=1>6 Children</option>
<option value=1>7 Children</option>
<option value=1>8 Children</option>
</select>
</td>
<td align=center><br>
<select id="num_Children3" onchange="return total3()">
<option value=0 selected>0 Children</option>
<option value=1>1 Child</option>
<option value=1>2 Children</option>
<option value=1>3 Children</option>
<option value=1>4 Children</option>
<option value=1>5 Children</option>
<option value=1>6 Children</option>
<option value=1>7 Children</option>
<option value=1>8 Children</option>
</select>
</td>
<td align=center><br>
<select id="num_Children4" onchange="return total4()">
<option value=0 selected>0 Children</option>
<option value=1>1 Child</option>
<option value=1>2 Children</option>
<option value=1>3 Children</option>
<option value=1>4 Children</option>
<option value=1>5 Children</option>
<option value=1>6 Children</option>
<option value=1>7 Children</option>
<option value=1>8 Children</option>
</select>
</td>
</tr>
<tr>
<td align=center>
<input type=button onclick="amountdue1()" name="total1" value="Find total">
<input type=reset value=Reset>
<br><br>
<input type="text" name="totaldue" size=15 readonly title="Total Amount" maxlength="9" placeholder="$">
</td>
<td align=center>
<input type=button onclick="total2()" value="Find total">
<input type=reset value=Reset>
<br><br>
<input type="text" name="totaldue2" size=15 readonly title="Total Amount" maxlength="9" placeholder="$">
</td>
<td align=center>
<input type=button onclick="total3()" value="Find total">
<input type=reset value=Reset>
<br><br>
<input type="text" name="totaldue3" size=15 readonly title="Total Amount" maxlength="9" placeholder="$">
</td>
<td align=center>
<input type=button onclick="total4()" value="Find total">
<input type=reset value=Reset>
<br><br>
<input type="text" name="totaldue4" size=15 readonly title="Total Amount" maxlength="9" placeholder="$">
</td>
</tr>
</table>
    function amountdue1() 
{
if (document.calc.familyname1.value === null || document.calc.familyname1.value.length === 0) 
{
alert("Please enter your family name");
}
else
{

var numadults = document.calc.num_Adults1.selectedIndex;
var numchildren = document.calc.num_Children1.selectedIndex;
document.calc.totaldue.value = (numadults * adult) + (numchildren * child) + 10; 
}}

您在函数中添加了额外的大括号。此外,该函数不会以分号结尾。请检查更新的

我认为问题出在脚本标签<script language="JavaScript/text">,看起来浏览器没有解析你的script元素。

<script language="javascript">

脚本的语言属性没有任何标准值,并且已弃用,您也可以简单地省略它。或者,您可以使用type属性<script type="text/javascript">