如何禁用或启用页面上的所有 onClick 图像

Question

当用户单击图像时，我希望禁用所有其他图像上的 onClicks，直到我的功能完成。

我目前有禁用它们的代码：

var eles = document.getElementsByTagName('img');
for (var i=0; i < eles.length; i++)
   eles[i].onclick = false;

但我不确定如何重新启用它们。 我努力了：

var eles = document.getElementsByTagName('img');
for (var i=0; i < eles.length; i++)
   eles[i].onclick = true;

但它不起作用。 任何人都有这个问题的解决方案

Answer 1

您的解决方案不起作用，因为您使用 onClick = false 删除了 onClick。 之后，您需要再次创建 onClick 事件处理程序。

这可能是您添加 onclick 事件的方式，我对其进行了更改，因此它应该可以工作。

<img src="image1.jpg" onclick="when_i_click();"/>
<img src="image2.jpg" onclick="when_i_click();"/>

尝试向您的 onclick 添加一个函数，如上所示。

您的点击功能：

var when_i_click = function(){
    alert('image clicked!');
}

这就是您禁用 onclicks 的方式（您的方法）

var eles = document.getElementsByTagName('img');
for (var i=0; i < eles.length; i++)
   eles[i].onclick = null;

这是您重新启用它们的方式（将函数重新附加到 onClick ）

var eles = document.getElementsByTagName('img');
for (var i=0; i < eles.length; i++)
   eles[i].onclick = when_i_click;

这是一个 Jquery 解决方案 jquery：

尝试使用无障碍 javascript，不要在 DOM 中添加 onclick 事件处理程序。

<script>
(function(){
    var function_is_finished = false;
    $('img').on('click',function(event){
        if(function_is_finished) {
            //Do your stuff when someone clicks on Img
        }
    });
})();
</script>

当您的功能完成时，只需将function_is_finished设置为true

Answer 2

一种解决方案是保存 onclick 的先前值并恢复它：

var disable_all = function () {
    var eles = document.getElementsByTagName('div');
    for (var i=0; i < eles.length; i++) {
      eles[i].prev_click = eles[i].onclick; // save the previous value
      eles[i].onclick = false;
    }
}

var enable_all = function() {
    var eles = document.getElementsByTagName('div');
    for (var i=0; i < eles.length; i++)
       eles[i].onclick = eles[i].prev_click;  // restore the previous value
    };

Answer 3

onclick 它应该指向一个 javascript 函数。 而不是 onclick 尝试。

eles[i].disabled="true"

在你的方法结束时回到 eles[i].disabled="false"

Answer 4

通过设置eles[i].onclick = false; 您正在将onclick事件重新分配给false 。 设置回 true 不会将其分配回原始函数。 最好在事件函数中处理取消分配。

Answer 5

基本上，您将元素的onclick设置为false和true 。 这相当于做类似的事情

<img src=".." onclick="false"/>

然后

<img src=".." onclick="true"/>

你应该做的是维护一些你检查的变量，看看你是否可以启动该函数。

locked = false;
function yourFunction() {
    if (locked) {
        locked = true;
        //... Do what you have to do here
        locked = false;
    };
}