gpt4 book ai didi

javascript - 外部 Javascript 脚本从未被调用

转载 作者:行者123 更新时间:2023-12-03 06:25:32 26 4
gpt4 key购买 nike

我正在尝试通过这个简单的练习来学习 javascript,但我似乎被难住了。当将数量放入 3 个单独的文本框中并调用我的函数来计算但没有返回数字时,我需要进行简单的计算。所以每个盒子里都会放一个数量,这是我的尝试:

function sum2()
{
var one = document.getElementById("book_1").value;
var two = document.getElementById("book_2").value;
var three = document.getElementById("book_3").value;

if ((one == "")||(two == "")||(three == ""))
{
alert ('Error', 'values missing');
}
else
{
var sum1 = one * 19.99;
var sum2 = two * 86.00;
var sum3 = three * 55.00;
var sum = sum1 + sum2 + sum3;

document.getElementById('output').value = sum;
document.write(sum);
}
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Work</title>
<script type="text/javascript" src="ex4.js"></script>
</head>
<body>
<div id="container">
<h2>Order Books Online</h2>
<form action="" method="post" id=”frm”>
<fieldset>
<table border="0">
<tr>
<th>Book</th>
<th>Quantity</th>
<th>Price</th>
</tr>
<tr>
<td>Basics of C++</td>
<td><input type="text" size="3" id="book_1" /></td>
<td>$19.99</td>
</tr>
<tr>
<td>Program Development in Perl</td>
<td><input type="text" size="3" id="book_2" /></td>
<td>$86.00</td>
</tr>
<tr>
<td>Advanced JavaScript</td>
<td><input type="text" size="3" id="book_3" /></td>
<td>$55.00</td>
</tr>
</table>
<br /><br />
<input type="submit" onclick="return sum2()" value="Place Order" id="sub" />
</fieldset>
</form>
</div>
</body>
</html>

我认为我有正确的代码,但可能只是缺少一些东西。我的外部 javascript 文件名为 ex4.js,与 html 文件位于同一文件夹中。我的函数是正确的,我相信我调用它是正确的,所以我不知道我哪里出了问题,只想返回总和!!

最佳答案

页面加载时立即调用该函数:

<script>
document.write(sum2());
</script>

当时,这些元素没有值:

var one = document.getElementById("book_1").value;
var two = document.getElementById("book_2").value;
var three = document.getElementById("book_3").value;

由于页面刚刚加载,用户还没有输入任何值。

<小时/>

您还尝试调用此处不存在的函数:

<input type="submit" onclick="sum()" value="Place Order" id="sub" />

这就是你应该调用你的函数的地方:

<input type="submit" onclick="sum2()" value="Place Order" id="sub" />
<小时/>

这里还有一个语法错误:

alert (Error, values missing);

字符串应该有引号:

alert ('Error', 'values missing');
<小时/>

您也没有对函数的结果进行任何操作:

<input type="submit" onclick="sum2()" value="Place Order" id="sub" />

如果这个函数正在处理点击事件,那么你应该做两件事:

  • 取消事件,以便不会发布表单
  • 在函数中,将值输出到页面

类似这样的事情:

<input type="submit" onclick="return sum2()" value="Place Order" id="sub" />

然后在函数中使用您的值后将返回false:

document.getElementById('output').value = sum;
return false;
<小时/>

顺便说一句,声明变量时还应该使用 var 关键字。这样它们就停留在本地范围而不是窗口范围内:

var sum1 = one * 19.99;
var sum2 = two * 86.00;
var sum3 = three * 55.00;
var sum = sum1 + sum2 + sum3;

此外,这是一个熟悉浏览器中的开发人员工具的绝佳机会。您可以监视网络请求(以确保首先加载外部资源)、读取错误消息(当浏览器试图告诉您问题时),以及在代码中放置调试断点单步执行并查看执行时发生了什么。

调试总是比猜测更好。

关于javascript - 外部 Javascript 脚本从未被调用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38675332/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com