模糊事件处理程序被jquery阻止preventDefault（）方法

Question

我正在开发一个交互式Web应用程序，当前在http://picselbocs.com/projects/goalcandy（用户：demo@demo.com，密码：demo）上设置。它允许您将包含图像和/或文本的项目从左侧栏拖到右侧的工作区中，并调整其大小和/或编辑它们。

要编辑创建对象上的文本，只需点击文本字段，标题或注释。 <span>元素被替换为<textarea>，然后您可以通过它编辑内容。当发生“模糊”事件时，textarea消失并将其值添加到<span>元素。 问题是，单击对象的图像（如果它同时具有图像和文本字段）可防止“模糊”事件触发。

我已经使用下面的代码片断来防止图像被从父对象分开拖动，只是发现这是什么导致的问题。但我不能没有利用这一点，并在同一时间，我不使用它：

$(document).on('mousedown dragstart', 'img', function(event) { event.preventDefault(); }); 

我怎样才能解决这个问题得到，并允许单击图像时onblur事件处理程序甚至可以运行，但同时保持默认的行为预防？

PS：alert('blur')调用允许我监视事件何时触发。

Answer 1

您可以使用一些变量说

var locks = {}; 
locks.textarea_lock = false; 

然后点击设置textarea的在locks.textarea_lock = true;图像处理程序检查这个锁：

$(document).on('mousedown dragstart', 'img', function(event) { 
    if (locks.textarea_lock) { 
     return; 
    } 
    event.preventDefault(); 
}); 

在 “模糊” 处理程序解锁变量locks.textarea_lock = false;。