Created attachment 84270 [details] illustration of the SVG onclick handlers If a function is defined inside the onload handler of an SVG document, and trying to call it with an onclick from an SVG element will execute an error in in Safari 5.0.3(6533.19.4) The red rectangle is set to handle "onclick" with a function call inside the onload handler: function red() { alert("red"); } The black rectangle is set to handle "onclick" with a function call outside the onload handler: function custom(evt) { alert(evt.target.id); } Note: The error in Safari developer (Inspect Element) panel issues: "ReferenceError: Can't find variable: red" (red is the function)?
That's correct behavior - function red is not defined in global scope, it's defined in the scope of init function. You can use something like the below to define a function in global scope from init: window.red = function() { alert("red") }
I understand that the resolution is to define the function globally. I guess, I should rephrase my question: Why is it that I cannot reuse a function declared locally? This is no big issue to me but it is out of curiosity. For example using local variables ONLY within the scope of the init function.
I guess, this is a very primitive question. So I'll leave this "RESOLVED". Thanks for your response, Alexey.
You can use the function (I actually suggested how to do that in comment 1). It's just not accessible by name from outside its scope. That's a good thing, because it lets one add functions in local scope without worrying about name clashes with functions defined in libraries like jQuery - similarly to local variables.