JavaScript function not defined in HTML-document, why not?

Question

I am coding a program that lets a user put in a telephone number and tell the user if it's accepted / denied based on a few conditions. I've worked out the function that does the calculation, but I can't get the JavaScript to work with the HTML-document: it doesn't get found.

Here are the two codes: (JS then HTML):

function testanummer(nummer){
    nummer = document.getElementById("a").value;
    if isNaN(nummer){
        console.log("Hi! This phone number appears faulty, please try again.");
    } else if (nummer.length <=8) && else if (nummer.length >=14) {
        console.log("Thanks! We'll be in touch shortly.");
    } else {
        console.log("Hi! This phone number appears faulty, please try again.");
    }

HTML:

<html>
<head>
    <title> Uppgift nummer 5</title>

    <script src="testanummer.js"></script>
</head> 


<body>
    <form>
        <label for="a">Skriv in ditt telefonnummer här: </label>
        <input type="text" name="nummer" id="a">
        <input type = "button" value ="Testa telefonnummer" onclick="testanummer(nummer);">
    </form>
</body>
</html>

Any idea why it doesn't work? I get this error:

Uncaught SyntaxError: Unexpected identifier

and:

Uncaught ReferenceError: testanummer is not defined

Any ideas why it doesn't work?

Thanks a lot!

Your "nummer" variable in your onclick event is undefined. Change it to onclick="testanummer(this.value)". Or remove the nummer from the function parameter and just call testanummer() since you retrieve the entered number in your function anyway. — Jules
– Jules, Commented Jan 10, 2013 at 15:44
The function is not defined because you have syntax errors. The error message will tell you where (you have to wrap all conditions for if statements into parenthesis, like so: if (isNaN(nummer))). — Felix Kling
– Felix Kling, Commented Jan 10, 2013 at 15:44
Your JS is malformed, is that the exact contents of testanumer.js ? — Nix
– Nix, Commented Jan 10, 2013 at 15:45
you're missing the last } from the javascript file to close the function, hence the syntax error. This means the file cannot be parsed, hence the ReferenceError. — Rhumborl
– Rhumborl, Commented Jan 10, 2013 at 15:45

Guffa · Accepted Answer · 2013-01-10 15:52:07Z

4

There are two syntax errors in the code. The first syntax error is here:

if isNaN(nummer){

It should be:

if (isNaN(nummer)) {

The second syntax error is in this line:

} else if (nummer.length <=8) && else if (nummer.length >=14) {

The syntax should be:

} else if (nummer.length <= 8  && nummer.length >= 14) {

However, it seems that you got the conditions backwards, I think this is what you mean:

} else if (nummer.length >= 8  && nummer.length <= 14) {

When calling the function, you should get the value from the textbox, not just a reference to it. Also, not all browsers put input fields in the global scope, use the form to access the field:

<input type = "button" value ="Testa telefonnummer" onclick="testanummer(this.form.nummer.value);">

Then you can skip the assignment of the nummer variable in the function.

edited Jan 10, 2013 at 15:52

answered Jan 10, 2013 at 15:46

Guffa

703k111 gold badges760 silver badges1k bronze badges

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

1 Comment

Guffa Over a year ago

@FelixKling: Yes, I just noticed. :)

Jules · Accepted Answer · 2013-01-10 15:53:59Z

0

Two errors:

} else if ((nummer.length <=8) && else if (nummer.length >=14)) {

Change it to (even though your condition is wrong... Shorter than 8 AND longer than 14?):

} else if ((nummer.length <=8) && (nummer.length >=14)) {

And you have an error in the onclick eventhandler:

onclick="testanummer(nummer);"

Should be:

onclick="testanummer(this.form.nummer.value);"

or if delete the argument from the function (since you retrieve it within the function anyway) even :

onclick="testanummer();"

So your final .js file should be:

function testanummer(nummer){
    nummer = document.getElementById("a").value;
    if (isNaN(nummer)) {
        console.log("Hi! This phone number appears faulty, please try again.");
    } else if ((nummer.length <=8) && (nummer.length >=14)) {  //HAVE A LOOK AT THIS CONDITION
        console.log("Thanks! We'll be in touch shortly.");
    } else {
        console.log("Hi! This phone number appears faulty, please try again.");
    }
}

edited Jan 10, 2013 at 15:53

answered Jan 10, 2013 at 15:47

Jules

7,2236 gold badges28 silver badges51 bronze badges

3 Comments

Martijn Over a year ago

You forgot a pair of parentheses... This code won’t compile either.

user1916173 Over a year ago

I have done what you said and I understand the logic behind it but the error is still there.

Jules Over a year ago

@Martijn Yeh I overlooked that. Changed.

Collectives™ on Stack Overflow

JavaScript function not defined in HTML-document, why not?

2 Answers 2

1 Comment

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related