隐藏 asp:Image SVG 元素答案

【问题标题】：Hide asp:Image SVG elements隐藏 asp:Image SVG 元素
【发布时间】：2020-04-03 09:51:07
【问题描述】：

我有一个复杂的SVG，但出于演示目的，我将使用一个仅包含两组的。

<svg id="sv" viewBox="0 0 150 150" xmlns="http://www.w3.org/2000/svg">
  <g id="gr1" fill="white" stroke="green" stroke-width="5">
    <circle cx="40" cy="40" r="25" />
    <circle cx="60" cy="60" r="25" />
  </g>
  <g id="gr2" fill="white" stroke="green" stroke-width="5">
    <circle cx="90" cy="60" r="25" />
    <circle cx="96" cy="40" r="25" />
  </g>
</svg>

这个 SVG 在 asp:Image 中被调用，如下所示：

<asp:Image ID="img" runat="server" Visible="true" Style="align-content: center;" ImageUrl="~/Img/circle.svg" />

我从this question 知道如何从我的 SVG 中隐藏元素。

我的问题是如何从asp:Image 中调用的svg 中隐藏例如gr2？

【问题讨论】：

不能被 ('#gr2').css('visibility','hidden') 隐藏吗？
那么如何指定“gr2”是从哪个图像形成的？
您可以从父 ID 钻取并在 JQ 中使用“查找”子代 $(''#SVGImageID').find('#gr2').css('visibility','hidden') ;像这样有效吗？

标签： javascript asp.net image svg

【解决方案1】：

看看这个：

<asp:ImageButton ID="Image1" OnClientClick="test()" runat="server" ImageUrl="~/Img/PumpStation/circle.svg" />

<script>
     function test() { $('#svgimageid').find('#gr1').css('visibility','hidden') });
</script>

【讨论】：

谢谢，但是我的 asp:Image 在哪里？如果在 asp:Image 中调用了 svg，我该如何使用 jquery 脚本？
当你想隐藏 onload 或任何按钮点击？
不加载，但在某些情况下（按钮单击、x 值>y 值等）。
加载页面时svg不显示。
我不知道你想做什么...检查控制台为什么不工作