标识具有相同"onclick“函数名的不同按钮
标识具有相同"onclick“函数名的不同按钮
提问于 2020-07-16 00:20:06
我的HTML文件中有3个按钮具有相同的onclick函数名。
<button id="name 1" onclick="choice()">John</button>
<button id="name 2" onclick="choice()">Martin</button>
<button id="name 3" onclick="choice()">Sam</button>和一个JS文件，该文件从按钮名称中列出一个列表，每个名称都有一个point属性设置为0。
let characters = [
{name: document.getElementById("name 1").textContent, points: 0},
{name: document.getElementById("name 2").textContent, points: 0},
{name: document.getElementById("name 3").textContent, points: 0}
];是否有一种方法可以使函数具有相互名称的惟一性，以便当我单击该按钮时，它只运行一个与该按钮相关的函数(就我的情况而言，单击John只向他添加一个点，而不是其他任何人)。此外，如何更改points属性的数量，以便每次单击按钮时都会增加1分
回答 2
Stack Overflow用户
回答已采纳
发布于 2020-07-16 00:49:04
是的，你可以做一个功能，运行独特的每个按钮。
希望这能帮上忙：
的一种方法是 :->您可以将按钮元素解析为选择函数的参数
let characters = [
{name: document.getElementById("name 1").textContent, points: 0},
{name: document.getElementById("name 2").textContent, points: 0},
{name: document.getElementById("name 3").textContent, points: 0}
];
function choice (button) {
const buttonCharacterObject = characters.find(obj => obj.name === button.textContent);
buttonCharacterObject.points += 1;
console.log(characters)
}<button id="name 1" onclick="choice(this)">John</button>
<button id="name 2" onclick="choice(this)">Martin</button>
<button id="name 3" onclick="choice(this)">Sam</button>
Stack Overflow用户
发布于 2020-07-16 00:44:54
您可以将一个参数传递给该函数，然后将该参数处理为执行特定的操作。函数语句将如下所示：
choice(parameter){
if(parameter == "John"){
characters[0].points = characters[0].points++;
} else if(parameter == "Martin"){
characters[1].points = characters[1].points++;
} else{
characters[2].points = characters[2].points++;
}
}你可以这样打电话：
<button id="name 1" onclick="choice("John")">John</button>
<button id="name 2" onclick="choice("Martin")">Martin</button>
<button id="name 3" onclick="choice()">Sam</button>像这样的东西会帮你的。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/62925601
复制相关文章
相似问题
腾讯云开发者
