如何将两个html元素绑定在一起,当第一个被删除时,第二个也从DOM

时间:2016-03-06 00:27:21

标签: javascript jquery html javascript-events

问题陈述如下: 我有单页应用程序与复杂的HTML布局。

此布局中有一个锚标记(带有用户电子邮件的div)。

当点击该锚点时,app会显示popover。

Popover被渲染成' body'。我不能在锚内部或附近渲染它,因为锚容器会切断弹出窗口,因为弹出窗口大小超过容器。

所以问题是当从DOM中删除锚元素时删除/隐藏popover的最佳方法是什么(它不是直接删除,而是通过删除其中一个父元素)。

我看到两个选项 - 一个是显示的弹出窗口的setInterval,用于检查锚是否仍然存在。

另一种方法是在弹出显示/隐藏时注册/取消注册一些回调,并在dom在单页应用逻辑实现中更改时调用它们以确保存在锚标记。

我只是觉得可能有另一种方法来实现位于不同DOM树分支中的锚和popover之间的这种绑定?

1 个答案:

答案 0 :(得分:0)

我建议通过为popover提供一个唯一的名称(可能使用每次创建弹出窗口时增加的javascript索引var)并将其存储在锚点的rel属性中来建议将popover链接到锚点。确保锚具有特定的类(例如'has-popover')

当要移除锚点的父元素时,请检查具有“has-popover”类的子元素。使用锚点的rel属性来获取弹出窗口的元素ID,以便随后将其删除。