2012-07-15 3 views
1

간단한 자바 스크립트 카운트 다운 프로그램을 만들고 싶습니다. 어떤 이유로 든 시작 링크를 클릭하지 않아도 카운트 다운이 시작됩니다. 자바에서 addEventListener가 자동으로 클릭 이벤트를 발생시킵니다.

<!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> 

내 자바 스크립트 파일

... startCountDown() 함수 startCountDown를 호출하기 때문이다

//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"); 
} 

답변

7

. 괄호를 제거하면 효과가 있습니다.

+0

괄호를 제거했지만 더 이상 자동으로 실행되지 않지만 시작을 클릭하면 아무 것도하지 않습니다. – Suren

+0

아마도 실행을 방해하는 앵커 일 것입니다. 'href' 속성을 제거하거나'#' – Zirak

+0

으로 변경하십시오 !! 당신을 위해 1 학년 선임 자락! – Suren

관련 문제