如何查询DOM对象集合上绑定的jQuery委托事件，避免重复绑定？

核心实现逻辑 #

jQuery 1.8及以上版本，官方内部提供了$._data()方法用于读取DOM元素的事件缓存，无需手动遍历动态变化的jQuery私有属性，开发调试场景下可稳定使用，完美解决你提到的属性名每次加载都变化的问题。

完整代码实现 #

function calculateHandlerSyndrome($target) {
  const delegateInfoList = [];
  // 从当前元素向上遍历所有父节点直到document
  let currentNode = $target[0];
  while (currentNode) {
    // 读取当前节点绑定的所有事件集合
    const events = $._data(currentNode, 'events');
    if (events) {
      // 遍历所有事件类型（click、input、change等）
      Object.keys(events).forEach(eventType => {
        events[eventType].forEach(handlerObj => {
          // 仅收集委托事件：绑定了selector属性的就是委托绑定的事件
          if (handlerObj.selector) {
            delegateInfoList.push({
              eventType: eventType,
              delegateRootTag: currentNode.tagName,
              delegateRootId: currentNode.id,
              targetSelector: handlerObj.selector
              // 如需更严格校验可补充handlerObj.handler.toString()
            });
          }
        });
      });
    }
    currentNode = currentNode.parentNode === document ? null : currentNode.parentNode;
  }
  // 直接返回序列化后字符串，无需额外处理即可对比
  return JSON.stringify(delegateInfoList);
}

使用说明 #

你原有的告警逻辑无需调整，直接替换函数实现即可：

let before = calculateHandlerSyndrome($('#container'));
performObjectLoad('#container', whatever)
  .then(/* 原有业务逻辑 */)
  .then(_ => {
    if (before !== calculateHandlerSyndrome($('#container'))) {
      sys.error("The object " + whatever + " has over-delegated");
    }
  });

注意事项 #

• $._data是jQuery内部API，仅推荐在开发环境的告警逻辑中使用，不要写入生产环境的业务逻辑
• 如果需要避免同选择器同事件但不同处理函数的场景被漏判，可以在收集信息时加入handlerObj.handler.toString()的结果作为对比项

内容的提问来源于stack exchange，提问作者LSerni