动态添加按钮HTML
动态添加按钮HTML
提问于 2018-06-08 05:01:36
我需要一个具有功能的按钮列表，但这些按钮将不会知道，直到网站实际加载。这是我一直在使用的实现：
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;
}<!DOCTYPE html>
<html>
<head>
</head>
<body>
<button onclick="putButtons()";>Load</button>
<br/>
<label id='ButtonLabel'></label>
<br/>
<label id='NumLabel'></label>
</body>
</html>
在加载按钮后，我希望它的功能是将我按下的任何数字添加到按钮下面的标签中。它做到了这一点，但它还在后面添加了一个1。它使用number和列表中的第一个成员调用该方法两次。
在Chrome中，这可以正常工作，但我正在编写的实际代码仍然不能。
这是我使用HTML/JavaScript的第二周，我不确定问题出在哪里。可能只是糟糕的实现。我甚至不确定我应该搜索哪些术语来解决这个问题(动态按钮添加？)。
有没有关于如何修复这个方法或者我应该如何做这项任务的想法？
提前谢谢。
回答 1
Stack Overflow用户
回答已采纳
发布于 2018-06-08 05:17:34
上面的代码工作正常，当你点击另一个按钮时，它会突出显示1按钮，但它不会在添加的最后一个数字之后附加任何1。如果您将标签元素更改为div，那么看起来您也不是在单击1。你不应该对这样的事情使用标签。通常应该为输入表单元素上的标签保留这些标签。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50750094
复制相关文章
相似问题