1

我想做一个简单的javascript倒计时程序。出于某种原因,倒计时触发无需我单击开始链接。

<!DOCTYPE HTML>
<html>
    <head>
        <title id = "titleElement">My Top Ten Movies</title>

    </head>

    <body>

        <p>Countdown Suren's favorite ten movies
            <a href="" id = "start"> Start </a>
        </p>

        <table>

            <thead>
                <tr>
                    <td>Number</td>
                    <td>Movie</td>
                </tr>   
            </thead>

            <tbody id = "movieList">

            </tbody>

        </table>

    <script src="js/practice.js"></script>  
    </body>
</html>

和我的 JavaScript 文件...

//get the start element
var start = document.getElementById("start");

//register listener
start.addEventListener('click', startCountDown(), false);


function startCountDown()
{
    //alert("Here!");
    //creat the list of 10 movies
    var myTenMovies = ["Breaveheart", "Mars Attacks", "Startship Troopers", "Jurassic Park", "Terminator 2",
                        "Austion Powers: Gold Member", "Fifth Element", "Bram Stocker's Dracula",
                        "Shashank Redemption", "LOTR: Return Of The King"];

    //get the location in the DOM to add each movie
    var tableLocation = document.getElementById("movieList");

    //create a timer function
    var countdown = setInterval(insertNextMovie, 750);

    //keep track of the index
    var index = 0;
    var movieRankIndex = 10;
    //alert("1");


    //function to add to DOM
    function insertNextMovie()
    {
        //alert("Here3!");
        //create a text nodes
        var movie = document.createTextNode(myTenMovies[index]);
        var rank = document.createTextNode(movieRankIndex);

        //create <td> element
        var rankData = document.createElement("td");
        var movieTitle = document.createElement("td");
        var row = document.createElement("tr");

        //add text to td
        rankData.appendChild(rank);
        movieTitle.appendChild(movie);

        //fill the row with data
        row.appendChild(rankData);
        row.appendChild(movieTitle);

        if(movieRankIndex == 1)
        {
            row.setAttribute("bgcolor", "yellow");
            //row.setAttribute("align", "right");
        }
        //add td to DOM table
        tableLocation.appendChild(row);

        //append index
        index++;
        movieRankIndex--;

        if(index == 10)
        {
            clearInterval(countdown);
        }

    }

    //alert("2");
}
4

1 回答 1

10

那是因为startCountDown()调用了函数startCountDown。删除括号,它会工作。

于 2012-07-15T05:47:56.773 回答