0

This dead simple stub of a web page will execute the translate() function in onload but not in the button's onclick. It instead throws "Uncaught TypeError: translate is not a function".

What simple mistake am I making?

function createSvgDef() {
    console.log("createSvgDef()");
}

function translate() {
    console.log("translate()");
}
<html>
<head>
    <link rel="stylesheet" href="this-thing.css"/>
    <script type="text/javascript" src="this-thing.js"></script>
</head>
<body onload="createSvgDef(); translate();">
    <textarea id="input">Hello World!</textarea>
    <button onclick="translate();">Translate</button>
    <div id="output"></div>
</body>
</html>
Hand-E-Food
  • 12,368
  • 8
  • 45
  • 80
  • Works fine..... – behkod Mar 06 '17 at 12:03
  • Interesting, but it's not working for me too. – Andrey Mar 06 '17 at 12:04
  • 1
    Weird case. It is not working for me on Chrome, but works fine on Firefox. If I change the name of the function from `translate` to anything else, it works on Chrome too. – Sinstein Mar 06 '17 at 12:06
  • Change name of function `translate` into something else for example `translate_abcd` and it works on Chrome also. Probably reserved name or some other problem why not working in Chrome. – KuKeC Mar 06 '17 at 12:07
  • Trust me to pick a reserved word not on the list. Renaming the method has solved it. Thank you! – Hand-E-Food Mar 06 '17 at 12:12
  • It isn't reserved. It just has a value (in a narrower scope) already. There are hundreds of things like that. The solution is to not use `onclick` *attributes* in the first place. – Quentin Mar 06 '17 at 12:14

0 Answers0