JS:未捕获对象:TypeError不是函数(onclick)
JS:未捕获对象:TypeError不是函数(onclick)
提问于 2013-03-26 01:02:25
Edit2:错误在该行上：<input type="button" value="totalbandwidthresult" onclick="javascript:totalbandwidth();">
尝试让一个按钮执行计算。所需变量如下所示，以及其中的HTML
我在点击时收到一个错误：Uncaught TypeError: object is not a function index.html:71 onclick
这是我的Javascript
function totalbandwidth() {
var fps=Number(document.calculator.fps.value);
var bitrate=Number(document.calculator.bitrate.value);
var numberofcameras = Number(document.calculator.numberofcameras.value);
var encoding = document.calculator.encoding.value;
if (encoding = "mjpeg")
{
storage = bitrate*fps;
}
else
{
storage = bitrate;
}
totalbandwidth = (numberofcameras * storage) / 1000;
document.calculator.totalbandwidthresult.value = totalbandwidth;
} HTML：
<form name="calculator" class="formtable">
<div class="formrow"><label for="rcname">RC Name</label> <input type="text" name="rcname"></div>
<div class="formrow"><label for="fps">FPS</label> <input type="text" name="fps"> </div>
<div class="formrow"><label for="bitrate">Bitrate</label> <input type="text" name="bitrate"> </div>
<div class="formrow"><label for="numberofcameras">Number of Cameras</label> <input type="text" name="numberofcameras"> </div>
<div class="formrow"><label for="encoding">Encoding</label> <select name="encoding" id="encodingoptions">
<option value="h264">H.264</option>
<option value="mjpeg">MJPEG</option>
<option value="mpeg4">MPEG4</option>
</select></div>
Total Storage: <input type="text" name="totalstorage">
Total Bandwidth: <input type="text" name="totalbandwidth">
<input type="button" value="totalbandwidthresult" onclick="javascript:totalbandwidth();"> 基本上-看起来我在JS中使用的语法可能有问题-但我不确定。
回答 4
Stack Overflow用户
回答已采纳
发布于 2013-03-26 01:38:50
请仅更改函数的名称；不需要其他更改
<script>
function totalbandwidthresult() {
alert("fdf");
var fps = Number(document.calculator.fps.value);
var bitrate = Number(document.calculator.bitrate.value);
var numberofcameras = Number(document.calculator.numberofcameras.value);
var encoding = document.calculator.encoding.value;
if (encoding = "mjpeg") {
storage = bitrate * fps;
} else {
storage = bitrate;
}
totalbandwidth = (numberofcameras * storage) / 1000;
alert(totalbandwidth);
document.calculator.totalbandwidthresult.value = totalbandwidth;
}
</script>
<form name="calculator" class="formtable">
<div class="formrow">
<label for="rcname">RC Name</label>
<input type="text" name="rcname">
</div>
<div class="formrow">
<label for="fps">FPS</label>
<input type="text" name="fps">
</div>
<div class="formrow">
<label for="bitrate">Bitrate</label>
<input type="text" name="bitrate">
</div>
<div class="formrow">
<label for="numberofcameras">Number of Cameras</label>
<input type="text" name="numberofcameras">
</div>
<div class="formrow">
<label for="encoding">Encoding</label>
<select name="encoding" id="encodingoptions">
<option value="h264">H.264</option>
<option value="mjpeg">MJPEG</option>
<option value="mpeg4">MPEG4</option>
</select>
</div>Total Storage:
<input type="text" name="totalstorage">Total Bandwidth:
<input type="text" name="totalbandwidth">
<input type="button" value="totalbandwidthresult" onclick="totalbandwidthresult();">
</form>Stack Overflow用户
发布于 2019-09-09 12:21:28
因为这个行为有点奇怪，所以我对这个行为做了一些测试，结果如下：
TL;DR
如果你是：
- In a
form，和 - 在)
上使用id="xxx"将id="xxx"或name="xxx"添加到该元素
- (例如，BAD
下面是一些测试及其结果：
控件示例(可以成功调用函数)
function totalbandwidth(){ alert("Total Bandwidth > 9000Mbps"); }<form onsubmit="return false;">
<button onclick="totalbandwidth()">SUCCESS</button>
</form>
向按钮添加id (调用函数失败)
function totalbandwidth(){ alert("Total Bandwidth > 9000Mbps"); }<form onsubmit="return false;">
<button id="totalbandwidth" onclick="totalbandwidth()">FAILED</button>
</form>
向按钮添加名称(调用函数失败)
function totalbandwidth(){ alert("Total Bandwidth > 9000Mbps"); }<form onsubmit="return false;">
<button name="totalbandwidth" onclick="totalbandwidth()">FAILED</button>
</form>
向按钮添加值(可以成功调用函数)
function totalbandwidth(){ alert("Total Bandwidth > 9000Mbps"); }<form onsubmit="return false;">
<input type="button" value="totalbandwidth" onclick="totalbandwidth()" />SUCCESS
</form>
将id添加到按钮，但不是在表单中(可以成功调用函数)
function totalbandwidth(){ alert("Total Bandwidth > 9000Mbps"); }<button id="totalbandwidth" onclick="totalbandwidth()">SUCCESS</button>
将id添加到表单内的另一个元素(可以成功调用函数)
function totalbandwidth(){ alert("The answer is no, the span will not affect button"); }<form onsubmit="return false;">
<span name="totalbandwidth" >Will this span affect button? </span>
<button onclick="totalbandwidth()">SUCCESS</button>
</form>
Stack Overflow用户
发布于 2013-03-26 01:36:24
我能够通过遵循这个帖子中的答案找到答案：https://stackoverflow.com/a/8968495/1543447
基本上，我将所有的值、函数名和元素名都重命名为不同的值，这样它们就不会冲突--而且它起作用了！
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15620620
复制相关文章
相似问题