Javascript errors when calling

Question

I have read and tried everything I can think of. The other pages that look identical with calling the function onclick work fine. I have tried all I know and read extensively with no avail.

<html>
<head>
    <title>Password</title>
</head>

    <body>

        <div id="output"></div>
        <input id="playername" placeholder = "Username" /> <br>
        <input id="password" placeholder = "Enter Password"/>
        <button onclick="test()">Are you correct?</button>
        <script src="pword.js"></script>    
    </body>

JS:

function test() {

    let output = document.querySelector("#output");
    let playername = document.querySelector("#playername");
    let password = document.querySelector("#password");

    if output.value === ("username") && password.value === ("Pa$$w0rd") {  
        console.log("CORRECT!");
    } else {
        console.log("Incorrect, try again");
    }

}

And what is the error? Can you provide a stack trace? The error message? Or at least the type of error? — Joseph
– Joseph, Commented Sep 20, 2019 at 15:25
The if statement in your test() function is incorrect; it's missing the parentheses around the expression. — Pointy
– Pointy, Commented Sep 20, 2019 at 15:25
I am sorry, this is the error ReferenceError: test is not defined — Adam Arnold
– Adam Arnold, Commented Sep 20, 2019 at 15:27
Perhaps a silly question, but Is the JS included on the page with the HTML? — circusdei
– circusdei, Commented Sep 20, 2019 at 18:27

Enzo B. · Accepted Answer · 2019-09-20 15:27:02Z

1

You forgot a bracket during your if statement

if HERE => ( output.value === ("username") && password.value === ("Pa$$w0rd") ) <= AND HERE {  
    console.log("CORRECT!");
} else {
    console.log("Incorrect, try again");
}

And it's better to do something like this, remove you'r onclick on HTML and do this :

HTML :

<button id="MyButton">Are you correct?</button>

JS :

var MyBtn = document.getElementById("MyButton");
MyBtn.addEventListener("click", test);

answered Sep 20, 2019 at 15:27

Enzo B.

2,3611 gold badge14 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

demkovych · Accepted Answer · 2019-09-20 15:26:36Z

0

if (playername.value === "username" && password.value === "Pa$$w0rd") {  
    console.log("CORRECT!");
} else {
    console.log("Incorrect, try again");
}

answered Sep 20, 2019 at 15:26

demkovych

9,0653 gold badges23 silver badges27 bronze badges

Comments

Taki · Accepted Answer · 2019-09-20 15:28:01Z

0

You're checking output.value instead of playername.value and the parenthesis are misplaced, here's a snippet with fixed code :

function test() {
  let output = document.querySelector("#output");
  let playername = document.querySelector("#playername");
  let password = document.querySelector("#password");

  if (playername.value === "username" && password.value === "Pa$$w0rd") {
    console.log("CORRECT!");
  } else {
    console.log("Incorrect, try again");
  }
}

<div id="output"></div>
<input id="playername" placeholder="Username" /> <br>
<input id="password" placeholder="Enter Password" />
<button onclick="test()">Are you correct?</button>

answered Sep 20, 2019 at 15:28

Taki

17.7k5 gold badges28 silver badges48 bronze badges

1 Comment

Adam Arnold Over a year ago

Wow, thank you all so much for the help, it will help me see mistakes to hopefully not make in the future!

Kanishka Malhotra · Accepted Answer · 2019-09-20 15:48:27Z

0

You are checking output.value instead of playername.value.

You can have a look at the working code here: https://repl.it/repls/ImaginaryCandidPerformance

answered Sep 20, 2019 at 15:48

Kanishka Malhotra

12 bronze badges

Collectives™ on Stack Overflow

Javascript errors when calling

4 Answers 4

HTML :

JS :

Comments

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

HTML :

JS :

Comments

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related