使用colorbox jQuery插件显示两组不同内容时，关闭colorbox时显示第一组内容

Question

jQuery 1.6.4 彩盒 1.3.19

我使用以下代码打开一个颜色框：

$.colorbox({inline: true,
            href: '#floatbox',
            innerHeight: '480',
            innerWidth: '530',
            top: '15%'});

“#floatbox”内部是一个按钮，单击该按钮最终会导致以下第二次调用颜色框：

$.colorbox({html: 'some_valid_html',
            transition: 'none',
            escKey: false,
            overlayClose: false);

我观察到第二个 HTML 内容显示正确，但在调用之前

$.colorbox.close()

稍后，“#floatbox”的内容（第一次调用的内容）在屏幕上闪烁。这不是我所期望的。一旦第一次调用的内容从屏幕上删除，我不希望用户再次看到它。

这是 Chrome/Safari 中的行为。

我已经尝试了几件事，包括：

1) 在第二次调用 $.colorbox 之前从 DOM 中强制删除“#floatbox”。

2) 将对 $.colorbox 的第二次调用绑定到在第一个颜色框内容中单击的链接。

3) 操作 $.colorbox 设置以从第一次调用中“撤消”'inline' 和 'href' 属性（尽管看起来我并不需要这样做）。

就好像 ColorBox 从第一次调用开始复制 DOM 节点并保留它。

这里有一些问题：

1) 是否有可能以某种方式记住了第一次调用中的“内联”和“href”设置？

2) 有什么方法可以操作打开的颜色框的当前设置？

感谢任何其他想法。

谢谢， 韦斯

Answer 1

就好像 ColorBox 从第一次调用开始复制 DOM 节点并保留它。

ColorBox 不会复制该元素，它会将节点从其在 DOM 中的原始位置移动。当您更改内容时，它会将其移回。

1) 是否有可能以某种方式记住了第一次调用中的“内联”和“href”设置？

不，该信息被丢弃。我不确定是什么导致了这些问题，但我怀疑这是实施过程中的疏忽。我会查看您的代码，以确保您不会意外调用 colorbox。