admin管理员组

文章数量:1434924

I'm creating a point-and-click style game to help my learning of JavaScript.

Concept is, a random co-ordinate is generated that corresponds to a square on a chess board, and the user has to click that square. When they click the square I'd like the id of that square to be stored as a variable so it can be pared with the randomly generated co-ordinate for parison to see if they clicked the correct square.

The issue is, when I select a square, I'm getting an error saying: "Uncaught TypeError: Failed to execute 'evaluate' on 'Document': 2 arguments required, but only 1 present."

Here's a HTML snippet:

<body>
    <div id="generator">
        <button onclick="ranCoord();">Start Chess Vision Trainer</button>
    </div>
    <div class="chessBoard">
        <div class="float-right">
            <div class="float-left rank"><p>8</p></div>
            <div id="a8" onclick="evaluate(this.id);" class="lightSquare"></div>
            <div id="b8" onclick="evaluate(this.id);" class="darkSquare"></div>
            <div id="c8" onclick="evaluate(this.id);" class="lightSquare"></div>
            <div id="d8" onclick="evaluate(this.id);" class="darkSquare"></div>
            <div id="e8" onclick="evaluate(this.id);" class="lightSquare"></div>
            <div id="f8" onclick="evaluate(this.id);" class="darkSquare"></div>
            <div id="g8" onclick="evaluate(this.id);" class="lightSquare"></div>
            <div id="h8" onclick="evaluate(this.id);" class="darkSquare"></div>
        </div> 

And here's the JS code:

// to generate random alphanumeric character from a-h
var file = new Array()
    file[0] = "a";
    file[1] = "b";
    file[2] = "c";
    file[3] = "d";
    file[4] = "e";
    file[5] = "f";
    file[6] = "g";
    file[7] = "h";

var rank = Math.floor(Math.random()* (8)) + 1; //random num between min (inclusive) and max (exclusive)
var letter = Math.floor(Math.random()*8);
var ranNum = file[letter] + rank; //generates random coordinate i.e. a8, b5, d1 etc.

//to display random coordinate in a div container so user can see 
function ranCoord() {
    document.getElementById("generator").innerHTML = ranNum;
}

//to pare if clicked square matches the randomly generated square
function evaluate(answer){

    if(answer == ranNum) {
         alert("correct");
     }
     else {
         alert("incorrect");
     }
}

I don't understand why it says two arguments are required as I've only included 1 argument in my evaluate function.

I'd like to build this project myself so I don't want anyone to reply with the entire coding solution to achieve my project aim. I'd just like to know why I'm getting this error.

Thanks in advance!

I'm creating a point-and-click style game to help my learning of JavaScript.

Concept is, a random co-ordinate is generated that corresponds to a square on a chess board, and the user has to click that square. When they click the square I'd like the id of that square to be stored as a variable so it can be pared with the randomly generated co-ordinate for parison to see if they clicked the correct square.

The issue is, when I select a square, I'm getting an error saying: "Uncaught TypeError: Failed to execute 'evaluate' on 'Document': 2 arguments required, but only 1 present."

Here's a HTML snippet:

<body>
    <div id="generator">
        <button onclick="ranCoord();">Start Chess Vision Trainer</button>
    </div>
    <div class="chessBoard">
        <div class="float-right">
            <div class="float-left rank"><p>8</p></div>
            <div id="a8" onclick="evaluate(this.id);" class="lightSquare"></div>
            <div id="b8" onclick="evaluate(this.id);" class="darkSquare"></div>
            <div id="c8" onclick="evaluate(this.id);" class="lightSquare"></div>
            <div id="d8" onclick="evaluate(this.id);" class="darkSquare"></div>
            <div id="e8" onclick="evaluate(this.id);" class="lightSquare"></div>
            <div id="f8" onclick="evaluate(this.id);" class="darkSquare"></div>
            <div id="g8" onclick="evaluate(this.id);" class="lightSquare"></div>
            <div id="h8" onclick="evaluate(this.id);" class="darkSquare"></div>
        </div> 

And here's the JS code:

// to generate random alphanumeric character from a-h
var file = new Array()
    file[0] = "a";
    file[1] = "b";
    file[2] = "c";
    file[3] = "d";
    file[4] = "e";
    file[5] = "f";
    file[6] = "g";
    file[7] = "h";

var rank = Math.floor(Math.random()* (8)) + 1; //random num between min (inclusive) and max (exclusive)
var letter = Math.floor(Math.random()*8);
var ranNum = file[letter] + rank; //generates random coordinate i.e. a8, b5, d1 etc.

//to display random coordinate in a div container so user can see 
function ranCoord() {
    document.getElementById("generator").innerHTML = ranNum;
}

//to pare if clicked square matches the randomly generated square
function evaluate(answer){

    if(answer == ranNum) {
         alert("correct");
     }
     else {
         alert("incorrect");
     }
}

I don't understand why it says two arguments are required as I've only included 1 argument in my evaluate function.

I'd like to build this project myself so I don't want anyone to reply with the entire coding solution to achieve my project aim. I'd just like to know why I'm getting this error.

Thanks in advance!

Share Improve this question asked Feb 20, 2020 at 15:40 Jacob CollinsJacob Collins 3036 silver badges15 bronze badges 2
  • Your random number generation is written outside of any function. Thus only one random number will be generated, at the time the script is first evaluated. – Pointy Commented Feb 20, 2020 at 15:46
  • I'm not sure I understand what you mean. Why would it need to be written inside a function? I need to use the number generator variable in multiple functions so it has to be declared outside any function, right? I've only started learning JavaScript the last month or so, so apologies if this question has an obvious answer. – Jacob Collins Commented Feb 21, 2020 at 14:37
Add a ment  | 

1 Answer 1

Reset to default 3

evaluate is a method of the document object of the DOM and therefore is within the spectrum of the reserved keywords (words you cannot use in your code because they are already part of the native JavaScript or DOM).

Try to rename your function checkIfCorrect.

本文标签: htmlJavaScript error executing a function 2 arguments required but only 1 presentStack Overflow