R Shiny实现点击外部区域隐藏Tooltip的方法求助

要实现点击信息图标显示/隐藏Tooltip，且点击页面任意其他区域自动隐藏的效果，只需修改你的dynam.js文件，添加全局点击监听逻辑即可，无需改动R代码和CSS：

修改后的dynam.js代码 #

$(function () {
  // 初始化所有tooltip
  $('[data-toggle=tooltip]').tooltip({
    trigger: 'click'
  });

  // 监听全局点击事件
  $(document).on('click', function(e) {
    // 检查点击目标是否关联tooltip元素或tooltip本身
    var isTooltipTrigger = $(e.target).closest('[data-toggle=tooltip]').length > 0;
    var isTooltipContent = $(e.target).closest('.tooltip').length > 0;
    
    // 点击非tooltip相关区域时，关闭所有已打开的tooltip
    if (!isTooltipTrigger && !isTooltipContent) {
      $('[data-toggle=tooltip]').tooltip('hide');
    }
  });
});

逻辑说明 #

1. 保持data-trigger="click"配置，确保点击信息图标可切换Tooltip的显示状态
2. 全局点击监听会做以下判断：
   • 若点击的是信息图标或Tooltip弹窗本身，保留原有切换逻辑
   • 若点击的是页面其他区域，自动关闭所有已打开的Tooltip
3. 原有的CSS样式和R Shiny代码无需任何修改，替换JS文件后即可实现预期效果

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