Question

我有一种情况，我从外部文件加载SVG图形并使用object标记方法将其嵌入到html中，然后我想使SVG交互，以便在SVG中的某些元素时单击，html页面中的一些其他元素会受到影响。我计划使用它，以便在单击图形的某个元素时，有关该主题的更多详细信息将显示在另一个元素中。

因此，主要的问题是，我需要使用哪种方法来嵌入SVG，我如何需要链接外部Javascript文件，以便Javascript的功能与html中包含的所有其他外部JS文件相同页面在body的末尾，我可以定位SVG内外的所有元素。如果jQuery也可以启用，那么一个很大的优点是，我理解这也是一个问题，因为DOM不同。

我不一定需要支持IE8或更低版本。

例如，如果我有以下结构：

<body>
  <!-- SVG graphic -->
  <object type="image/svg+xml" data="images/somegraphic.svg">
  Your browser does not support SVG
  </object>

  <!-- details appear in this div -->
  <div class="details"></div>

  <!-- external JS file -->
  <script scr="somejavascript.js">
</body>

我想做，例如这在外部JS文件中。即我需要外部JS能够在html内部和SVM之外的两个元素。

// recognize click inside the SVG, assume an element inside the SVG has a class "clickable"
$(".clickable").click(function(){
  $(".details").text("Detailed information about what you just clicked.");
});

外部文件中的Javascript / jQuery，外部文件中有SVG

0 个答案: