“模糊”事件是否仅针对 HTML 表单对象触发？

Question

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

我已经设置了一个onblur事件处理程序以在新创建的对象失去焦点时触发（至少在理论上），并且出于测试目的，该处理程序只是进行alert()调用。问题是处理程序根本没有被触发。Bellow 是用于创建这些新对象的一段代码：

obj.id = 'mesh-obj-'+current_object_id;
jqObject
    .attr('id',obj.id)
    .attr('item_no', current_object_id)
    .removeClass('dragged transparent tpl-obj no-user-select')
    .addClass('mesh-obj')
    .css({
        'z-index' : current_z_index,
        'left' : obj.position.left - mesh.position.left - mesh.borderWidth,
        'top' : obj.position.top - mesh.position.top - mesh.borderWidth,
        'right' : 'auto'
    })
    .on("focusout blur", function(event){
        alert('object lost focus'); 
    })
    .appendTo('#mesh');

模糊事件是否仅针对表单输入或任何 HTML 标签触发？如果是后者，那我做错了什么？

Answer 1

您需要为 html 元素分配 tabindex 以捕获模糊事件

html：

<div id="box1" class="box" tabindex="1">div 1</div>
<div id="box2" class="box" tabindex="2">div 2</div>

js：

$('.box').blur(function(){
   console.log(this)
})