JavaScript onclick why does it say function not defined?
Question
I have been writing this code to generate a countdown maths question and answer, but it doesn't work when i run it (sorry for questionable variable names also this is one of my first times using JavaScript so i might not be doing sone things right):
function remove(arr, value){ for( var i = 0; i < arr.length; i++){ if ( arr[i] === value) { arr.splice(i, 1); } } } function pop(array, value){ let n = array[value] remove(array, value) return n; } let num = [25, 50, 75, 100] let anum = [] function genrt(){ let leng = parseInt(document.getElementById("i1");) let small = parseInt(document.getElementById("i2");) for(i=0; i<leng; i++){ anum.push(Math.floor(Math.random()*10)+1) } for(i=0; i<small; i++){ anum.push(num[Math.floor(Math.random()*3)]) } document.getElementById("1").innerHTML = "Your numbers are: " + String(anum); let nuum = Math.floor(Math.random()*(anum.length-1)) let out = anum[nuum] remove(anum, nuum) ans = String(out) lenggg = Math.floor(Math.random()*anum.length-3)+3 for(i=0; i<lenggg; i++){ let op = Math.floor(Math.random()*3) let nnuu = Math.floor(Math.random()*(anum.length-1)) let nuuuum = anum[nnuu] remove(anum, nnuu) if(op==0){ out+=nuuuum ans+='+' } if(op==1){ out-=nuuuum ans+='-' } if(op==2){ out*=nuuuum ans+='*' } if(op==3){ out/=nuuuum ans+='/' } ans+=String(nuuuum) ans+='\\n' } document.getElementById("2").innerHTML = "Your target is: " + String(out); } function reveal(){ document.getElementById("3").innerHTML = "The solution is (without bodmas): " + ans; }
<!doctype html> <html> <head> <title>countdown generator</title> </head> <body> <p>How many small numbers</p> <input type="int" id="i1" value=3> <p>How many big numbers</p> <input type="int" id="i2" value=2> <button onclick="genrt()">Generate</button> <p id="1">Your numbers are:</p> <p id="2">Your target is:</p> <button onclick="reveal()">Solve it</button> <p id="3">The solution is (without bodmas)</p> </body> </html>
But when i press the generate button it says function genrt not defined. I have looked for an answer for ages and tried quite a few things but nothing seems to work, does anyone know what i am doing wrong?
3 answers
solution1
5 2021-10-14 22:03:04
You have syntax errors on these lines:
let leng = parseInt(document.getElementById("i1");)
let small = parseInt(document.getElementById("i2");)
You have misplaced ; symbol. You should always read console output, the error was clearly visible in the console logs.
solution2
3 ACCPTED 2021-10-14 22:06:14
Your script has a syntax error. The first error you should be seeing in your console is
Uncaught SyntaxError: missing ) after argument list
Obviously, since it failed to compile the Javascript, then when you afterwards try to call a function from that failed block, it will not exist because the JS engine couldn't read the code in order to load it.
If you fix the syntax error then the undefined function error will go away. It's actually a fairly simple couple of typos:
let leng = parseInt(document.getElementById("i1");)
let small = parseInt(document.getElementById("i2");)
needs to become
let leng = parseInt(document.getElementById("i1"));
let small = parseInt(document.getElementById("i2"));
; is always to end a line - if you have something after the ; which doesn't of itself form a valid line of code, then you know it's definitely wrong. I suggest using an IDE or code editor which understands JavaScript syntax and can highlight these kinds of issues to you before you even attempt to run the code.
(I make no guarantees that you won't then have other unrelated errors or bugs, I haven't tested the code to that extent.)
solution3
0 2021-10-14 22:29:49
there wqs semicolon in on those lines
let leng = parseInt(document.getElementById("i1");)
let small = parseInt(document.getElementById("i2");)
ans variable was not difine
but i dont know if the result is what you want
i have make some corrections
<html> <head> <title>countdown generator</title> </head> <body> <script> function remove(arr, value){ for( var i = 0; i < arr.length; i++){ if ( arr[i] === value) { arr.splice(i, 1); } } } function pop(array, value){ let n = array[value] remove(array, value) return n; } let num = [25, 50, 75, 100] let anum = [] let ans = null function genrt(){ let leng = parseInt(document.getElementById("i1")) let small = parseInt(document.getElementById("i2")) for(i=0; i<leng; i++){ anum.push(Math.floor(Math.random()*10)+1) } for(i=0; i<small; i++){ anum.push(num[Math.floor(Math.random()*3)]) } document.getElementById("1").innerHTML = "Your numbers are: " + String(anum); let nuum = Math.floor(Math.random()*(anum.length-1)) let out = anum[nuum] remove(anum, nuum) console.log(String(out)) ans = String(out) lenggg = Math.floor(Math.random()*anum.length-3)+3 for(i=0; i<lenggg; i++){ let op = Math.floor(Math.random()*3) let nnuu = Math.floor(Math.random()*(anum.length-1)) let nuuuum = anum[nnuu] remove(anum, nnuu) if(op==0){ out+=nuuuum ans+='+' } if(op==1){ out-=nuuuum ans+='-' } if(op==2){ out*=nuuuum ans+='*' } if(op==3){ out/=nuuuum ans+='/' } ans+=String(nuuuum) ans+='\\n' } document.getElementById("2").innerHTML = "Your target is: " + String(out); } function reveal(){ document.getElementById("3").innerHTML = "The solution is (without bodmas): " + ans; } </script> <p>How many small numbers</p> <input type="int" id="i1" value=3> <p>How many big numbers</p> <input type="int" id="i2" value=2> <button onclick="genrt()">Generate</button> <p id="1">Your numbers are:</p> <p id="2">Your target is:</p> <button onclick="reveal()">Solve it</button> <p id="3">The solution is (without bodmas)</p> </body> </html>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.