Question

我有一个嵌入了svg图像的html页面。

SVG图像位于单独的文件中。 SVG图像引用了一个执行一些图像定位功能的javascript文件。

HTML页面引用相同的javascript文件并具有用于放大图像并重置图像缩放和位置的控件，其功能在javascript文件中实现。

我想要做的是在重新定位图像时设置一个标记，以便我知道何时显示和隐藏html页面上的重置图像按钮。

因为我已经两次引用了这个javascript文件，所以我运行了2个单独的版本，因此svg引用设置的标志与html引用读取的标志不同。问题是图像定位是由svg图像启动的，缩放是由html页面启动的。

我有什么想法可以解决这个问题吗？

Answer 1

我建议您执行以下操作，让SVG内的脚本通过调用html页面脚本隐藏/显示按钮。

您可以访问的外部脚本：

window.parent.toggleButton();

然后按钮本身可能是你的“旗帜”，如果它是隐藏的。

我还发现了这个代码，它存在于SVG文件中，您可以在其中将对SVG单击元素的引用传递给您的html页面：

function sendClickToParentDocument(evt)
{
    // SVGElementInstance objects aren't normal DOM nodes, 
    // so fetch the corresponding 'use' element instead
    var target = evt.target;
    if(target.correspondingUseElement)
        target = target.correspondingUseElement;

    // call a method in the parent document if it exists
    if (window.parent.svgElementClicked)
        window.parent.svgElementClicked(target);

}

Src：https://stackoverflow.com/a/10516723/2827823

在SVG图像和HTML页面中引用相同的javascript文件

1 个答案: