Question

我有一个SVG，其中包含一些linearGradient元素，这些元素会在单击按钮时更改。see here一切正常。我的问题是，如果示例中的svg是外部文件并在<object>标签中调用，该怎么办？

我的SVG：

<object data="Img/PumpStation/Pump.svg" type="image/svg+xml" id="alphasvg1111"></object>

我的按钮：

<asp:Button ID="Button1" class="test" runat="server" Text="Button" />

我的jQuery函数：

jQuery('.test').on('click', function () {
    //$("object").contents().find("path").attr({ "fill": "red" });
    jQuery('object stop').each(function () {
        var color = jQuery(this).css('stop-color');
        if (color === 'rgb(77, 77, 77)') {
            jQuery(this).css('stop-color', '#ff0000');
        }
    });
});

如果我使用：$("object").contents().find("path").attr({ "fill": "red" });，则当单击按钮时，我的SVG变为红色。为什么其余功能无法正常工作？

Answer 1

您需要获取object元素的内容：

interleaveStreams

jQuery在<object>标签内选择SVG元素

1 个答案: