2010-01-25 2 views
2

js로 스크립팅을하는 데있어 매우 익숙합니다. 내 질문은, 어떻게 다른 div에서 아무도 디스플레이를 설정 h1에서 onclick을 설정할 수 있습니까? 여기JS : h1을 클릭하여 다른 div에서 아무 표시도 설정하지 않음

내 코드 :

var에 ITER;

 function toggleGroups() 
     { 
      function getAllGroups() 
      { 
       titlebars = document.getElementsByClassName('titlebar_js'); 
       groupfields = document.getElementsByClassName('inner_groups_gether'); 
       for(i = 0; i < titlebars.length;i++) 
       { 
        tb = titlebars[i]; 
        iter = i; 
        tb.onclick = function() 
        { 
         alert(iter); 
         groupfields[iter].style.display = 'none'; 
        } 
       } 
      }   
      getAllGroups(); 
     } 

     window.onload = function() 
     { 
      toggleGroups(); // Aufruf der Funktion 
     } 

작동하지 않습니다.

답변

2

이봐, 다른 사람이 맞다, jQuery를 아주 빨리이 문제를 해결하기에 좋은 곳입니다. 예 :

<html> 
<head> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
    <script type="text/javascript"> 
     jQuery(window).bind("load", function() { 
      $('h1').click(function() { 
       $('div.toBeHidden').css('display','none'); 
      }); 
     }); 
    </script> 
</head> 
<body bgcolor="yellow"> 
<h1>Click me!</h1> 
<div class="toBeHidden"> 
    This block will be hidden after clicking the h1... 
</div> 
</body> 
</html> 

여기에 당신이 어떤 H1 태그를 잡고 사라질 클래스 "toBeHidden"로 된 div를 만들기 위해 브라우저를 말하고있다.

bout jQuery here을 배울 수 있습니다. 확실히 가치가 있습니다. jQuery를 시작한 후에는 거의 순수한 자바 스크립트를 사용하지 않습니다.

+0

부적절한 경우 : 묻는 사람은 각각의 'h1'이 모두가 아닌 각각의 'div'를 숨기를 원합니다. – raveren

1

당신은 실제로 jquery과 같은 자바 스크립트 라이브러리를 봐야합니다.

+0

-1 : 너무 유용하기 때문에 너무 애매합니다. jQuery를 사용하는 요청한 것과 비슷한 예제에 대한 링크. 괜찮 으면 좋지만 특별히 도움이되지는 않습니다. – Quentin

1

일반적인 JS 클로저 버그에 빠졌습니다. 이 시도 :

여기
tb.onclick = function(val) { 
        return function() { 
        alert(val); 
        groupfields[val].style.display = 'none'; } 
       }(iter); 

당신이 폐쇄 및 이벤트 핸들러를 사용하는 방법에 대한 자세한 내용을보실 수 있습니다 : http://www.webreference.com/programming/javascript/rg36/

1
function toggleGroups() 
    { 
     var titlebars = document.getElementsByClassName('titlebar_js'), 
      groupfields = document.getElementsByClassName('inner_groups_gether'), 
      tLength = titlebars.length, 
      tb, iter; 

     while (tLength--) 
     { 
      tb = titlebars[tLength]; 
      iter = tLength; 
      tb.onclick = function(iter) 
      { 
       return function() 
       { 
        alert(iter); 
        groupfields[iter].style.display = 'none'; 
       } 
      }(iter); 
     } 
    } 
    window.onload = function() 
    { 
     toggleGroups(); // Aufruf der Funktion 
    } 
관련 문제