자바 스크립트, 이미지 클릭 (function, onclick)

Question

그래서 PHP로이 기본 이미지 웹 사이트를 만들고 각 개인 프로필에 이미지 공간을 만들려고합니다. 내가 클릭 할 때 이미지가 최대화되도록 (현재와 같이)하고 싶습니다. 그런 다음 다시 클릭하면 이전 위치로 돌아갑니다 (하지 않습니다). 당신이 http://www.uk-sf.com/profile.php?view=pgallery:17

여기에 예를 볼 수 있지만 여기에 코드 수 : 아래 당신이 할 수있는 당신이 자바 스크립트 함수

function clickimage(id) 
     { 
      var y = document.getElementsByClassName('pgall'); 
      var x = document.getElementsByClassName('pgall2'); 

      var length = y.length, 
      element = null; 
      for (var i = 0; i < length; i++) { 
       element = y[i]; 
       element.className = 'pgall'; 
      } 

      var length = x.length, 
      element = null; 
      for (var i = 0; i < length; i++) { 
       element = x[i]; 
       element.className = 'pgall'; 
      } 

      id.className = 'pgall2'; 
     } 

이 다음

<img id="1" onclick="clickimage(this)" class="pgall" src="XXX"> 

을 클릭 img 요소입니다 현재는 두 번째 CSS 클래스 "pgall2"로 클릭 한 내용이 항상 변경됩니다. id.className == "pgall2"인 경우 "pgall"도 변경해야합니다. 그러나 if 문을 사용하여이 작업을 시도했지만 작동하지 않습니다.

   if(id.className == 'pgall') 
       { 
       id.className = 'pgall2'; 
       } 
       else { 
       id.className = 'pgall'; 
       } 

Answer 1

함수는 클래스를 추가하지 않고 전체 클래스 값을 대체합니다. 클래스를 변경하면 본질적으로 새로운 요소가 생성됩니다. 이 시점에서 사용할 수있는 동일한 이벤트 처리기가 없습니다. 동적 요소 이벤트에 How do I add a class to a given element?

더 : http://toddmotto.com/attaching-event-handlers-to-dynamically-created-javascript-elements

---

UPDATE를 : 제대로 추가 클래스를 추가하는 방법

당신은 jQuery를 사용할 수 있습니다. 왜 그것을 사용하지 않습니까?

jQuery('.pgall').click(function() { 
    jQuery(this).toggleClass('pgall pgall2'); 
}); 

는

http://jsfiddle.net/isherwood/vPC7r/