Guiders.js attachTo 在 iframe 中不起作用答案

【问题标题】：Guiders.js attachTo not working inside iframeGuiders.js attachTo 在 iframe 中不起作用
【发布时间】：2016-01-29 22:47:46
【问题描述】：

我正在使用guiders.js 给用户提示。虽然当 div 位于 iframe 内时，我在使用 attachTo 参数时遇到问题。

这是向导的代码：

    guiders.createGuider({
    attachTo: '#'+thisId,
    buttons: [{name: "Ok", onclick: function(){
closeEdit();
    guiders.hideAll();
    }
    }],
    description: "<input value='new text'>",
    id: "guiderToChangeParameter",
    position: 3,
    title: "title",
    width: 400
    }).show();

如果 thisId 引用页面内的 div id，则 attachTo 有效。

如果 thisId 引用 iframe 中的 div，则引导显示但不附加到 div。

这是 guiders.js 库的正常行为吗？有没有办法真正附加到 iframe 中的 div？

jsfiddle 显示 attachTo 工作：http://jsfiddle.net/y3mzP/1/ jsfiddle 不允许 iframe，所以很遗憾我无法重现。

【问题讨论】：

标签： javascript guiders.js

【解决方案1】：

我不希望任何 JavaScript 能够访问 iFrame，而不仅仅是 guiders.js。如果您想让父页面上的元素位于父页面上的元素附近，则必须使用 iFrame 消息发布 (https://developer.mozilla.org/en-US/docs/DOM/window. postMessage) 让内部的脚本将目标元素的 x 和 y 位置中继到父框架上的脚本。

在您的情况下，您还可以创建一个绝对定位在父页面上的透明 div，使其大致位于您期望内部元素所在的位置。然后让 Guiders 附加到那个透明的 div 上。

【讨论】：