javascript按钮onclick按下只能工作一次

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了javascript按钮onclick按下只能工作一次相关的知识,希望对你有一定的参考价值。

我是javascript的新手,有以下问题:

html

<div id="button"></div>

JS:

for (var items in $scope.data.users){
    if ($scope.data.users.hasOwnProperty(items)) {
        document.getElementById("button").innerHTML += "<button onclick='console.log(5)'>"+items+"</button>";
        console.log(items);
    }
}

到目前为止,我的json对象中的所有用户都被读取并且为每个项目创建了一个按钮,当我单击一个按钮时,它会在控制台中显示正确的测试“5”。但是,当我重复点击时,出现错误,我不知道为什么......

答案

我认为您的数组或范围在click事件上已更改。

虽然以下示例不是用(我相信)您的Angular模块编写的,但它确实可以工作并迭代列表,创建按钮并且不会抛出任何错误或异常。基本上它是具有不同数组的相同代码。试着找出它和你自己的代码之间的区别。

我改变的唯一一件事就是让$scope.data.users成为一个整数数组。

let arr = [1, 2, 3];

for (var items in arr){
    if (arr.hasOwnProperty(items)) {
        document.getElementById("button").innerHTML += "<button onclick='console.log(5)'>"+items+"</button>";
        console.log(items);
    }
}
<div id="button"></div>

以上是关于javascript按钮onclick按下只能工作一次的主要内容,如果未能解决你的问题,请参考以下文章

Android工作室:按钮onClick()不起作用

如何在 Flutter 中显示 onclick 按钮动画布局?

在 btn.onclick = function() 中包含一个参数 [重复]

如何使用 Android 样式来控制视图的 onClick 行为 [重复]

按下按钮时选择联系人onClick Android

javascript onclick事件无法正常工作