Side navigation
#11352 closed bug (wontfix)
Opened February 15, 2012 04:34PM UTC
Closed February 15, 2012 07:32PM UTC
delegate on inline SVG with < use > element throws error
| Reported by: | desandro | Owned by: | |
|---|---|---|---|
| Priority: | low | Milestone: | None |
| Component: | misc | Version: | 1.7.1 |
| Keywords: | Cc: | ||
| Blocked by: | Blocking: |
Description
See http://jsfiddle.net/desandro/SawTC/
With an event delegate on an inline SVG, you can click on the orange circle, which was rendered with <circle> element, but clicking on the red or blue circle throws an error. The red and blue circle are rendered with <use> . The error is
Uncaught TypeError: Cannot call method 'toLowerCase' of undefined jquery-1.7.1.js:2827
About <use>: It allows you to define a shape and re-use it multiple times without having to define it again. http://www.w3.org/TR/SVG/struct.html#UseElement
If I inspect the red or blue circle, I can get its nodeName from the reference element #my-circle.
Attachments (0)
Change History (2)
Changed February 15, 2012 04:47PM UTC by comment:1
| _comment0: | Browsers, tested on Mac OSX 10.7.3 \ \ + occurs in Chrome 18 \ + occurs in Safari 5.1.3 \ + no error in Firefox 10, this is always the svg element \ + occurs in Opera 11.61 \ \ in jQuery 1.6.4, No error is thrown, but no click event is triggered when clicking the <use> elements → 1329324522000517 |
|---|
Changed February 15, 2012 07:32PM UTC by comment:2
| component: | unfiled → misc |
|---|---|
| priority: | undecided → low |
| resolution: | → wontfix |
| status: | new → closed |
Browsers, tested on Mac OSX 10.7.3
+ occurs in Chrome 18
+ occurs in Safari 5.1.3
+ no error in Firefox 10, this is always the svg element
+ occurs in Opera 11.61
in jQuery 1.6.4, No error is thrown, but no click event is triggered when clicking the <use> elements
Hack/Fix is to set CSS
svg use { pointer-events: none; }