2011-08-18 5 views
2

고유 한 작은 문제가 있습니다. 특정 라디오 단추를 선택하면 컨테이너를 표시하고 숨겨야합니다. 불행히도 내 이벤트 리스너는 선언 될 때 해고되고 이벤트가 실제로 발생하지는 않습니다. 다른 누구도 이런 종류의 문제에 부딪 혔습니까?선언 된 JavaScript 이벤트 리스너가 다시는 발생하지 않습니다.

<!DOCTYPE html> 
<html> 
    <head><title>test</title></head> 

<body> 
    <form name="form"> 
     <input type="radio" name="r1" id="r1_yes" value="yes"> 
     <input type="radio" name="r1" id="r1_no" value="no"> 
     <div id="r1_comments" class="comments">Comments r1</div> 
     <br /> 

     <input type="radio" name="r2" id="r2_yes" value="yes"> 
     <input type="radio" name="r2" id="r2_no" value="no"> 
     <div id="r2_comments" class="comments">Comments r2</div> 
    </form> 

<script type="text/javascript"> 
function checkCommentTrigger(element, comments, trigger) { 
    if (element.value===trigger && element.checked) { comments.style.display="block"; } 
    else { comments.style.display="none"; } 
} 

function comments(fieldName, commentsID, triggerValue) { 
    var t_elements, t_comments, i; 

    t_elements = document.getElementsByName("fieldName"); 
    t_comments = document.getElementById(commentsID); 

    t_comments.style.display="none";   


    for (i=0; i<t_elements.length; i++) { 
     if (t_elements[i].addEventListener){t_elements[i].addEventListener("click",checkCommentTrigger(this, t_comments, triggerValue),true);} 
     else {t_elements[i].addEvent('onclick',checkCommentTrigger(this,t_comments,triggerValue));} 
    } 
} 

comments("r1","r1_comments","no"); 
comments("r2","r2_comments","no"); 

</script> 
</body> 
</html> 

답변

4

당신은 이 "하여 addEventListener"호출 함수를 호출입니다. 즉,이 코드에서 (두 줄로 나누어) :

if (t_elements[i].addEventListener){ 
     t_elements[i].addEventListener("click",checkCommentTrigger(this, t_comments, triggerValue),true);} 

"checkCommentTrigger()"함수를 호출하고 있습니다. 또한

else { 
     t_elements[i].attachEvent('onclick',function() { checkCommentTrigger(this,t_comments,triggerValue) });} 

, 당신이 원하는 다음 "만약"의 다른 지점에 대한

if (t_elements[i].addEventListener){ 
     t_elements[i].addEventListener("click",function() { checkCommentTrigger(this, t_comments, triggerValue) },true);} 

같은 : 당신이해야 할 일은이 같은 함수에 참조에서 통과, 그래서 뭔가 IE에 대한 "attachEvent()"가 아니라 "addEvent()"입니다.

편집 — 다시 한번 살펴보면 위에 쓴 것처럼 사용하면 해당 코드에 문제가있을 것입니다. 이 문제는 이벤트 처리기로 사용하는 함수에서 this에 대한 참조에서 비롯됩니다. "checkCommentTrigger"에 대한 첫 번째 인수가 검사 할 요소가되기를 원한다고 생각합니다. 별도의 기능을 설정하는 것이 가장 간단 될 수 있습니다 다음

function handlerFor(element, comments, value) { 
    return function() { 
     checkCommentTrigger(element, comments, value); 
    } 
    } 

전화 할 수 있습니다 당신은 이벤트 핸들러 함수를 필요로 할 때 :

if (t_elements[i].addEventListener){ 
     t_elements[i].addEventListener("click", handlerFor(t_elements[i], t_comments, triggerValue), true); 
    } 
+0

으악, 그보고, 나는 또한 있었다 fieldName에 등을 내 getElementsByName 안의 문자열 ... 감사합니다. Pointy, 생명의 은인. – seanmetzgar

관련 문제