“blur”事件是否仅针对 HTML 表单对象触发

Does the "blur" event fire only for HTML form objects?

本文关键字：表单 HTML 单对象 blur 事件 是否      更新时间：2023-09-26

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

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

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 标记触发？如果是后者，那我做错了什么？

您需要

将 tabindex 分配给 html 元素才能捕获模糊事件

.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)
})

模糊事件不仅可以用于表单元素。

有关详细信息，请阅读本文。

相关文章：