javascript - 为我添加的每个元素在节点内容中添加模态窗口

Question

我现在正在使用库 jquery.orgchart.js。

我在我的组织结构图中显示了不同的级别，一切都很好。对于最后一个级别，人们希望看到团队中的每个人，在同一个节点中，并带有一个弹出链接以显示带有一些文本的图像。

对于节点，我们可以添加第二个菜单，如本例所示:https://github.com/wesnolte/jOrgChart/issues/37

我想知道是否可以为我在悬停或单击时添加到节点中的每个元素(每个员工)弹出一个窗口。这是来自 Bootstrap 的我的按钮对话框模式的代码:

OnHover:只显示标题，不显示数据内容:

<button type="button" class="btn btn-primary" data-toggle="popover" title="Test en cours" data-content="You gotta go through it to see there aint nothing to it. Listen to the silence."> Hover 1</button>

                $(document).ready(function() {
                       $('[data-toggle="popover"]').popover({
                          placement: 'bottom',
                          trigger: 'click',
                          title: 'Sign in to the website builder',
                          content: 'testing 123'    
                       });

                    });

也许我必须在 html 组件上绑定(bind)点击事件或使用库 jquery.orgchart.js？!如果我在页面而不是组织结构图中放置相同的按钮，效果会很好。

Image for modal that works如果您需要其他信息来帮助我，请尽管提出。

感谢您的帮助。

这是我的弹出窗口隐藏的解决方案:

        $(document).ready(function() {
                       $('[data-toggle="popover"]').popover({
                          placement: 'bottom',
                          trigger: 'hover',
                          title: 'Sign in to the website builder',
                          content: 'testing 123',
                          container: 'body' 
                       });

                    });

我添加了标签 container :'body'，我的弹出窗口终于出现了!

Answer 1

我刚刚在这里找到了解决方案:github.com/twbs/bootstrap/issues/5889 我更新了我的帖子