onclick 이벤트에서 루프를 설정하는 루프

Question

나는 이번 달의 달력을 가지고 있으며 onclick 이벤트에 대한 다른 정보를 입력 할 수있는 새 창을 열어야합니다. 그래서 나는 onclick() 이벤트를 여러 div에 설정하는 for 루프를 가지고있다. title 속성은 클릭 된 날짜를 유지한다. 이것은 내 코드이지만 클릭 한 달의 날짜와 상관없이 동일합니다.

window.onload = function() { 
'use strict'; 
var i = 0, newAppt, infoGet; 

newAppt = document.getElementsByTagName('div'); 
for (i = 0; i < newAppt.length; i++) { 
    if (newAppt[i].getAttribute('title') !== '') { 
     infoGet = newAppt[i].getAttribute('title'); 
     newAppt[i].addEventListener('click', newApptWin(infoGet), false); 
    } 
} 
}; 
function newApptWin(infoGet) { 
'use strict'; 
window.open(infoGet,'test','toolbar=0');  
} 

도움이 필요하십니까? 감사!

Answer 1

귀하의 코드는 페이지가로드 될 때 newApptWin (infoGet) 함수를 즉시 실행하며 변경되지 않습니다. 함수의 결과가 아닌 eventListener에 함수를 전달해야합니다 (여기에서 수행 한 것). (이 잘못 업데이트)

newAppt[i].addEventListener('click', function() {newApptWin(infoGet);}, false); 

편집 : 당신과 같이 고칠 수 for 루프 내에서

선언 infoGet. 전체 스크립트를

window.onload = function() { 
'use strict'; 
var i = 0, newAppt; 

newAppt = document.getElementsByTagName('div'); 
for (i = 0; i < newAppt.length; i++) { 
    if (newAppt[i].getAttribute('title') !== '') { 
     var infoGet = newAppt[i].getAttribute('title'); 
     newAppt[i].addEventListener('click', function() {newApptWin(infoGet);}, false); 
    } 
} 
}; 
function newApptWin(infoGet) { 
'use strict'; 
window.open(infoGet,'test','toolbar=0');  
} 

또는 완전히 infoGet를 생략하고 잠재적 인 메모리 누수 방지 할 수 있습니다 : 나는 대한의 CONSOLE.LOG을 수행 할 때

window.onload = function() { 
'use strict'; 
var i = 0, newAppt; 

newAppt = document.getElementsByTagName('div'); 
for (i = 0; i < newAppt.length; i++) { 
    if (newAppt[i].getAttribute('title') !== '') { 
     var infoGet = newAppt[i].getAttribute('title'); 
     newAppt[i].addEventListener('click', newApptWin, false); 
    } 
} 
}; 
function newApptWin() { 
'use strict'; 
window.open(this.getAttribute('title'),'test','toolbar=0');  
}