javascript - Turbolinks 不适用于 SVG 链接

Question

我有一个 Rails 应用程序，它有一个 SVG，它有一些椭圆作为链接。这些链接工作正常，但它们不适用于 Turbolinks。普通链接与 turbolinks 一起工作。有没有办法让 SVG 链接与 Turbolinks 一起工作？

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
      height="650px" viewBox="0 0 341.334 532.666" enable-background="new 0 0 341.334 532.666"
     xml:space="preserve" id="map">
 <g id="Layer_2">
    <a xlink:href="/lotes/84" data-toggle="tooltip" title="Lote 84">
        <ellipse fill="none" id="L-84" stroke="#000000" stroke-miterlimit="10" cx="27.833" cy="135.997" rx="23.833" ry="24.333" class="lote "/>
    </a>
    <a xlink:href="/lotes/090" data-toggle="tooltip" title="Lote 090">
        <ellipse fill="none" id="L-090" stroke="#000000" stroke-miterlimit="10" cx="74.667" cy="185.831" rx="23" ry="24.167" class="lote Algodon"/>
    </a>
    <a xlink:href="/lotes/091" data-toggle="tooltip" title="Lote 091">
        <ellipse fill="none" id="L-091" stroke="#000000" stroke-miterlimit="10" cx="122.833" cy="187.331" rx="23.833" ry="24" class="lote Algodon"/>
    </a>
 </g>
</svg>

Answer 1

我只是opened an issue为了这。同时，借助 Turbolinks 3(不确定 2)，您可以使用 Turbolinks.visit() 管理解决方法。

使用 jQuery:

$('svg a').on('click', function(event) {
  event.preventDefault();
  Turbolinks.visit( this.getAttribute('href') );
});

使用 D3:

svg.selectAll('a')
  .on('click', function() {
    d3.event.preventDefault();
    Turbolinks.visit( 
      d3.select(this).node().getAttribute('href')
    );
  });