Question

I'm having an issue with JavaScript and SVG. When i execute a mouseDown event over a SVG element with the CTRL (or ALT) key pressed, the browser (Firefox) opens a new tab / window. I'd like to simply call a function to manipulate my SVG document, without opening any new tab or window. I'm not concern with the browser's properties. I've been dealing with another code of mine, and nothing happens even when I click over a SVG element under the same conditions, but this is a legacy code, that has over 9000 lines, and I can't identify why the browser behaves differently.

So, i'd like to know if there is any property of the SVG document that can be set to avoid new tabs / windows.

Actually, I did realize that this issue is about hte xlink of svg. I have a few items defined as symbols

<symbol id="TANQs">
     <path d="m 97,42 a74,74 0 0,0 -94,0" />
     <rect x="3" y="42" width="94" height="26" />
</symbol>

And I have use elements too, like the example above:

<use id="TQ-43120" x="100" y="200" **xlink:href="#TANQs"** onmouseover="mouseOver(evt)" onmouseout="mouseOut(evt)" oculto="false">
      <lasca:segmento tag="2&quot;-HC-310-1702-Ba-V-B1-SEG1"/>
</use>

My problem occurs when I click over the use elements, cause the browser thinks of them like normal links, so when I click with hte ctrl key pressed, it opens a new tab. I would like to know if there is any way to avoid this behavior of the browser.

As suggested, the commands preventDefault() and stopPropagation() didn't seem to work.

Was it helpful?

Solution

Found a fix to be simply adding the trusty "return false" to the root SVG element.
For Example:

<svg ... onclick="return false;">...</svg>

Will successfully stop the browser opening a new tab or window.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top