Created
December 13, 2011 19:51
-
-
Save enjalot/1473597 to your computer and use it in GitHub Desktop.
safari select bug
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/> | |
| <title>Safari Select bug</title> | |
| <style type="text/css"> | |
| </style> | |
| </head> | |
| <body> | |
| <button id="select">Select</button> | |
| <button id="a">Select All</button> | |
| <p> Select doesn't work in Safari because we have two different elements with the same id, even though we are selecting like "g#a". Select All works, and both work in Chrome/Firefox.</p> | |
| <svg id="svg"></svg> | |
| <script type="text/javascript" src="http://mbostock.github.com/d3/d3.js?2.6.0"></script> | |
| <script type="text/javascript"> | |
| var w = 960; | |
| var h = 500; | |
| var svg = d3.select("#svg"); | |
| var a = svg.append("svg:g") | |
| .attr("id", "a") | |
| var b = a.append("svg:g") | |
| .attr("id", "b") | |
| var select = d3.select("#select") | |
| .on("click", function(d,i) { | |
| ss = d3.select("#svg") | |
| aa = ss.select("g#a") | |
| bb = aa.select("g#b") | |
| console.log("svg", ss, ss.node()) | |
| console.log("aa", aa, aa.node(), "bb", bb, bb.node()) | |
| }) | |
| var select = d3.select("button#a") | |
| .on("click", function(d,i) { | |
| ss = d3.select("#svg") | |
| aa = ss.selectAll("g#a") | |
| bb = aa.select("g#b") | |
| console.log("svg", ss, ss.node()) | |
| console.log("aa", aa, aa.node(), "bb", bb, bb.node()) | |
| }) | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment