ListItem 내부의 하이퍼 링크 태그에 onclick 핸들러를 추가하는 데 문제가 있습니다

Question

내 탭에 onclick 핸들러를 추가하려고 시도하면 DOM 선택을 올바르게 얻을 수 없습니다. 당신은 도울 수 있습니까?

  <div id="tabstrip">
    <ul>
      <li id="a" class="selected"><a href="#">A</a></li>
      <li id="b"><a href="#">B</a></li>
      <li id="b"><a href="#">C</a></li>
    </ul>
  </div>

function initTabStrip()
{
  var lis = document.getElementById('tabstrip').getElementsByTagName('li');
  for (var i=0;i<items.length;i++)
  {
    var as = items[i].getElementsByTagName('a');
    for (var j=0;j<as.length;j++)
    {
      as[j].onclick=function(){changeTab(items[i].id);return false}
    }
  }
}

Answer 1

폐쇄가 잘못된 것 같습니다. 노력하다

as[j].onclick = function(items, i)
{
    return function()
    {
        changeTab(items[i].id);
        return false;
    };
}(items, i);

그것이 작동한다면 질문은 jQuery 클로저, 루프 및 이벤트

Answer 2

나는 Roborg에 동의하고 JavaScript Scopes에 대해 읽는 것을 제안합니다. 그것은 많이 설명 할 것입니다.

Answer 3

JS의 첫 번째 줄, 당신은 만든다 var lis 그러나 당신은 반복합니다 items. 정말 당신이 원하는 것입니까?

Answer 4

Roberg가 제안한 변경 사항과 함께 완전한 기능 :

function initTabStrip()
{
  var tabstrip = document.getElementById('tabstrip');
  var items = tabstrip.getElementsByTagName('li');
  for (var i=0;i<items.length;i++)
  {
    var as = items[i].getElementsByTagName('a');
    for (var j=0;j<as.length;j++)
    {
      as[j].onclick = function(items, i)
      {
        return function()
        {
          changeTab(items[i].id);
          return false;
        };
      }(items, i);
    }
  }

}