Question

我需要一个功能按钮列表，但在网站实际加载之前，按钮不会被人知道。这是我一直在使用的实现：

＆＃13;

var list = [1, 2, 3, 4, 5, 6, 7, 8];
function placeAnotherNumber(num)
{
	document.getElementById("NumLabel").innerHTML += " " + num;
}

function putButtons()
{
	var temp = "";
	for(i = 0; i < list.length; i++)
	{
		temp += "<button onclick='placeAnotherNumber(" + list[i] + ");'>" + (i+1) + "</button>";
	}
	document.getElementById("ButtonLabel").innerHTML = temp;
}

＆＃13;

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<button onclick="putButtons()";>Load</button>
<br/>
<label id='ButtonLabel'></label>
<br/>
<label id='NumLabel'></label>

</body>
</html>

＆＃13;

加载按钮后，我希望功能是将我按下的任何数字添加到按钮下方的标签上。它做到了这一点，但它也增加了1。它使用数字和列表中的第一个成员调用方法两次。

在Chrome中，这可以按预期工作，但我正在处理的真实代码仍然没有。

这是我的第二周HTML / JavaScript，我不确定是什么问题。可能只是糟糕的实施。我甚至不确定我应该用谷歌搜索什么术语（动态按钮添加？）。

有关如何修复此方法或我应该如何执行此任务的任何想法？

提前致谢。

Answer 1

上面的代码正常工作，当您点击另一个按钮时突出显示1按钮，但在添加最后一个数字后它没有追加任何1。如果您将标签元素更改为div，那么它也不会像您一样点击1。你不应该为这样的东西使用标签。这些应该保留给输入表单元素上的标签。

动态添加按钮HTML

1 个答案: