javascript onchange 대 onkeyup 이벤트 <Select>에 대한 이벤트 (위아래 키는 Firefox에서 onchange 이벤트를 실행하지 않습니다)

Question

IE와 Opera에서 완벽하게 작동하는 <select id="myselect" name="myselect" onChange="(myfunction();)">...</select>이 있습니다. "완벽 함"이란 단어가 마우스로 드롭 다운 목록에서 값을 변경하거나 "위로", "아래로", "PageUp"(Opera가 아닌), "PageDown"(Opera가 아님) , "Home"및 "End"키를 누르십시오. Firefox, 3.6.Xv를 사용하여 테스트 할 때 문제가 나타납니다. "위"와 "아래"를 사용할 때는 아무런 변화가 없지만 마우스의 경우에는 여전히 효과가 있습니다. onkeyup 이벤트를 사용 하시겠습니까? 나는 그것을 시도했다, 그것은 "잡는다"위아래로, 그러나, IE는 onChange와 onkeyup 이벤트를 가지고있는 것으로 보인다. 하지만 단 하나의 이벤트가 필요합니다. 사람들이이 문제를 어떻게 해결합니까?

감사합니다.

Answer 1

change 이벤트를 계속 사용하는 것이 좋습니다. Firefox 구현은 키보드 사용자에게 많은 의미를줍니다. select 요소로 탭하고 Up, Down 키를 사용하여 항목을 선택하면 (길게 나열하려면 많이 누르십시오) 웹 페이지에서 많은 수의 작업을 트리거하지 않으려 고합니다. 올바른 항목을 선택하고 다른 항목으로 이동하면 작업을 실행하는 것이 좋습니다.

Answer 2

위 화살표 또는 아래 화살표인지 확인하기 위해 키 코드를 테스트하고 이에 따라 변경 이벤트를 발생시키는 keyup 이벤트에 대해 고유 한 처리기를 만들 수 있습니다.

내 자신 JS

당신에게 예를 작성하는 충분하지 않습니다하지만 난 그렇게 할 몇 가지 예를 jQuery를 보여줄 수 :

$('yourSelect').keyup(function(e) 
{ 

    if (e.keyCode===38) 
    { 
     //this is an up arrow press 

     //trigger the change event 
     $('yourSelect').change(); 
    } 
    else if (e.keyCode===40) 
    { 
     //down arrow has pressed 

     //trigger the change event 
     $('yourSelect').change(); 
    } 
});