在前端开发中，我们需要经常处理各种事件。其中，blur() 事件是当元素失去焦点（即用户离开该元素）时触发的事件。但是，在一些情况下，我们需要知道哪个对象触发了这个事件。本文将介绍如何获取触发 jQuery blur() 事件的被点击对象以及相关的示例代码。
获取触发事件的对象
要获取触发事件的对象，可以使用 event.relatedTarget 属性。在 blur() 事件中，该属性返回导致元素失去焦点的元素。在其他一些事件中，该属性可能会返回 null 或 undefined。
以下是一个简单的示例代码，演示了如何使用 event.relatedTarget 属性来获取触发事件的对象：
$('input').on('blur', function(event) {
var clickedElement = event.relatedTarget;
console.log(clickedElement);
});上面的代码将在控制台中打印出触发 blur() 事件的被点击对象。请注意，如果用户点击页面上的空白区域，则 event.relatedTarget 属性将为 null。
应用示例
下面是一个更实际的应用示例。假设我们有一个表格，其中包含一些输入框。当用户在输入框中键入值并移动到下一个输入框时，我们希望自动计算这些输入框中的总和。为了实现这个功能，我们需要检测每个输入框是否失去了焦点，并在失去焦点时更新总和。
以下是示例代码：
-- -------------------- ---- -------
-------
----
---------- ------------- -------------------------
---------- ------------- -------------------------
---------- ------------- -------------------------
---------- ------------- -------------------------
-----
--------
--------
---------------------------- -
--------------
---------------------------- --------------- -
--------------
---
-- ----
-------- ------------- -
--- ----- - --
--------------------------------- -
--- ----- - ------------------------
-- --------------- -
----- -- ------
-
---
------------------------
-
---
---------
----------- ----- -------------------------上面的代码演示了如何使用上述方法来获取触发 blur() 事件的被点击对象，并更新表格中的总和。
结论
在本文中，我们介绍了如何获取触发 jQuery blur() 事件的被点击对象。通过使用 event.relatedTarget 属性，我们可以轻松地确定触发事件的元素。此外，我们还提供了一个实际应用的示例代码，以帮助您更好地理解如何使用这些技术。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/28026