자바 스크립트 그리드에서 키보드 컨트롤 구현

Question

자바 스크립트 그리드 컨트롤을 작성 했으므로 모든 것이 정상적으로 끝납니다. 페이징, 버튼 탐색, 열 정렬 등

격자의 셀은 Mootools 1.2.4 (컨트롤 전반에 많이 사용됨)를 사용하여 생성되는 DIV입니다.

그리드의 키보드 컨트롤을 구현하고, 페이징 (페이지 업/페이지 다운) 및 그리드의 셀/셀 내부에서 화살표 키로 이동하기 위해. 그리드의 각 셀에 이벤트 핸들러를 연결하고 적절한 조치를 취하기 위해 어떤 키가 눌러 졌는지 감지해야한다고 생각합니다. 하지만, 나는 세포에 초점을 설정할 수 없습니다.

무엇이 누락 되었습니까? 어떻게해야합니까? 어떤 도움을 주셔서 감사합니다.

Answer 1

가능한 당신이 아닌 폼 요소의 tabindex를 추가 할 수있는 해킹있다, 그것은 블러, 당신의 초점이 같은 행사를 형성 수와 청취자 여기

은 예입니다 : http://www.jsfiddle.net/htgZ4/

하지 않도록하는 방법 크로스 브라우저입니다.

$$("div").each(function(el, i) { 
    el.set("tabindex", i).addEvents({ 
     focus: function() { 
      this.addClass("focused"); 
     }, 
     blur: function() { 
      this.removeClass("focused"); 
     }, 
     keydown: function() { 
      this.addClass("editing"); 
      console.log("down"); 
     }, 
     keyup: function() { 
      this.removeClass("editing"); 
     } 
    }); 
}); 

$$("div").getRandom().focus();