如何在 JavaScript 中为 img 元素禁用/启用自定义点击事件答案

【问题标题】：How to disable/enable custom click event for an img element in JavaScript如何在 JavaScript 中为 img 元素禁用/启用自定义点击事件
【发布时间】：2010-12-01 23:02:28
【问题描述】：

我有一个 ASP.NET 日期选择器控件（无可用源），它生成一个图像元素，单击该元素时会显示一个日历。我想通过 JavaScript 按需禁用或启用图像。当我将“禁用”属性添加到 img 元素时，页面中的某些脚本总是处于忙碌状态，并且页面永远不会完成渲染。我猜 disabled 属性在某种程度上导致了冲突。

我现在的下一个尝试是禁用 ASP.NET 控件添加的自定义单击事件。如何禁用点击事件？如何重新启用它，以便 img 正常工作。我也在使用 jQuery 1.4。

【问题讨论】：

当你试图禁用是如果在文档准备好之后？
是的。我有一个启用/禁用 img 的复选框。

标签： javascript jquery

【解决方案1】：

var $img = $('img#yourid'),
    handler = $img.get(0).onclick; // previous click handler
// unbind
$img.unbind('click').click(function(){
    alert('new click');
});
// rebind
$img.unbind('click').click(handler);

您可能还需要检查其他事件（mousedown mouseup 等）。

【讨论】：

【解决方案2】：

我这里有一个示例，它将所有点击事件交换到隐藏的 div，然后再次返回以重新启用：

http://jsfiddle.net/Jbs9V/

可能有一些捷径可以做到这一点，但这是可行的。同样，您可以将点击处理程序存储在全局变量中并从中加载它们：

http://jsfiddle.net/8ZKJR/

【讨论】：

【解决方案3】：

我认为这个错误可能是因为 datepicker 使用文本控件来做它的东西，但是如果控件被禁用，datepicker 不能继续，但是你可以使用其他属性来做几乎相同的事情，使用属性标签中的只读：

readonly="readonly"

您可以在 html 输入中使用只读属性。

希望这会有所帮助。

【讨论】：

【解决方案4】：

您可以使用 unbind() 删除任何使用 jquery 的自定义事件处理程序。

【讨论】：