CODEWITHSUNDEEP
javascripthtml
kevinvdk
kevinvdk

Reputation: 3

Javascript function not invoked

I am trying to make a program that tests someones ability to learn different foreign words. For this I need to have a javascript function that hides a DIV and, fills an empty one, and then calls setTimeout(). The problem is that this function is not being called from what I can tell.

I have tried to find an answer online but couldn't find a solution that worked, maybe one of you guys can help. Here is my code:

<html>
<head>
    <style type="text/css">
        #starter
        {
            text-align: center;
            margin-top: 15%;
        }

        #main
        {
            text-align: center;
            z-index: -1;
            <?php
                $i = rand(1, 8); 
                switch($i) {    

                }
            ?>
        }
    </style>
    <script type="text/javascript">

        function weghalen(var element) {
            var element = document.getElementById('starter');
                element.parentNode.removeChild(element);
        }

        function volgendePagina() {
            window.location.href = "test.php";
        }

        function startOnderzoek() {
            weghalen('starter');

            var tekst = <?php include 'Scripts.php'; echoWoorden(); ?>;
            document.getElementById('mainP').innerHTML = tekst;

            setTimeout(volgendePagina(), 6000);
        }

    </script>
</head>

<body>
    <div id="starter">
        <p>
            Als u op 'Start onderzoek' druk begint uw timer van 6 seconden te lopen. Aan het einde van uw 6 seconden wordt u vanzelf naar een volgende pagina gebracht.
        </p>
        <a href="javascript: startOnderzoek()">
            <input type="button" value="Start onderzoek" />
        </a>
    </div>
    <div id="mainDIV">
        <p id="mainP"></p>
    </div>
</body>

Thanks in advance!

Upvotes: 0

Views: 74

Answers (3)

brenjt
brenjt

Reputation: 16297

Try changing your link to use an onclick:

<a href="javascript:void(0);" onclick="startOnderzoek(); return false;">

Also you need to change your setTimeout to this:

setTimeout(volgendePagina, 6000);

Having the parenthesis after volgendePagina will cause it to execute immediately and not when the 6 seconds are up.

Also in reference to what Paul said about the weghalen function. The parameter is named the same as the variable that you're creating.

You might want to consider refactoring the function like so:

function weghalen(child) {
    var element = document.getElementById('starter');
        element.parentNode.removeChild(child);
}

I am also not sure that the logic of weghalen will work as you expect.

Upvotes: 1

squill25
squill25

Reputation: 1208

Try:

setTimeout(volgendePagina, 6000);

or

setTimeout(function(){ volgendePagina() }, 6000);

Also here:

function weghalen(var element) {
    var element = document.getElementById('starter');
        element.parentNode.removeChild(element);
}

Firstly, you do not include var in between the function's parenthesis. Secondly, you are creating a variable which has the same name as the function's parameter, so the language doesn't know which one you want to use where. Change it to something like this:

function weghalen(el) {
    var element = document.getElementById('starter');
    element.parentNode.removeChild(el);
}

Upvotes: 1

Paul Roub
Paul Roub

Reputation: 36438

Check your JS console: you can't include var in a function parameter declaration. Change:

function weghalen(var element) {

to:

function weghalen(element) {

Upvotes: 1

Related Questions