我试图计算数组“flowers”中每种类型的花的数量，该数组存储在外部库的数组中。有“玫瑰”、“万寿菊”、“郁金香”三种花。我有一个带有按钮的 html 页面，单击该按钮会告诉我存储的数组中每朵花有多少朵。但是，我的程序在运行时不会给我计数。代码对我来说看起来是正确的，所以我完全不知道它有什么问题。
document.getElementById('go').onclick = function () {
roseCount = 0;
marigoldCount = 0;
tulipCount = 0;
lengthArray = flowers.length;
for (f = 0; f < lengthArray; f++) {
if (flowers[f] == 'rose') {
roseCount ++;
};
if (flowers[f] == 'marigold') {
marigoldCount ++;
};
if (flowers[f] == 'tulip') {
tulipCount ++;
};
document.getElementById('tulip').value = tulipCount;
document.getElementById('rose').value = roseCount;
document.getElementById('marigold').value = marigoldCount;
};
};
HTML
<body>
<button id = 'go' class = ''>COMPUTE</button>
<input id = 'number' name = '' value = '' class = ''>
<input id = 'sum' name = '' value = '' class = ''>
<input id = 'average' name = '' value = '' class = ''>
<script src = 'http://gobongo.net/information/24065/script/javascript array 02 data.js'></script>
<script src = 'js/javascript 11.js'></script>
</body>
最佳答案
您试图在文档加载完成之前将 onclick 处理程序附加到元素。因此，将您的代码替换为:
// ignore this line, you already have a flowers array
var flowers = ['rose','rose','rose','marigold','marigold','marigold','tulip','tulip'];
// wait for the DOM to load
window.onload = function() {
// attach your event handler now the DOM is ready!
document.getElementById('go').addEventListener('click', function () {
var roseCount = 0;
var marigoldCount = 0;
var tulipCount = 0;
// calculate number of items
for (var i=0, l=flowers.length; i<l; i++) {
if (flowers[i] === 'rose') roseCount++;
if (flowers[i] === 'marigold') marigoldCount++;
if (flowers[i] === 'tulip') tulipCount++;
}
// update your inputs outside of the loop!
document.getElementById('tulip').value = tulipCount;
document.getElementById('rose').value = roseCount;
document.getElementById('marigold').value = marigoldCount;
});
}<!-- clean up your HTML... just to satisfy my OCD :) -->
<body>
<button id="go">COMPUTE</button>
<input id="tulip" name="tulip" value="">
<input id="rose" name="rose" value="">
<input id="marigold" name="marigold" value="">
<script src="http://gobongo.net/information/24065/script/javascript array 02 data.js"></script>
<script src="js/javascript 11.js"></script>
</body>关于Javascript计算数组中每种类型的数量，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46857411/