0

내 눈이 파손되어이 질문은 키보드 이벤트에만 적용됩니다.keypress 이벤트 대 클릭 이벤트

나는이 같은 버튼에 클릭 이벤트에 대한 핸들러를 정의 할 때 : 나는 내가 대부분의 웹 어플리케이션은 HTML을 실행하는 클릭 이벤트를 사용할 생각 (마우스를 사용할 수 없기 때문에

$("#button").on("click", function() { 
    alert("clicked"); 
}); 

요소), 나는이 이벤트를 버튼으로 가서 enter를 눌러 테스트했다. 이벤트가 성공적으로 시작되었습니다. 그 이후로 엔터 키를 누르면 html 요소에 대한 클릭 이벤트를 시뮬레이트한다고 믿게되었습니다. 나는 많은 시간을 제출 버튼을 실행했기 때문에 그것이 사실이라고 믿을 이유가 없다.

이제는 액세스 할 때 값으로 채워야하는 텍스트 상자를 만듭니다. 이렇게 했어.

$("#text").on("click", function() { 
    alert("clicked"); 
}); 

그러나 입력을 누르면 더 이상 값이 표시되지 않습니다. 그러나 다른 사람이 마우스를 사용하여 요소를 클릭하면 이벤트가 성공적으로 발생합니다. 나는 JQuery와 - UI의 자동 완성 기능을 사용하고

: 여기

내가 일하고 코드입니다. 사용자가 텍스트 상자에 들어가면 텍스트 상자를 채우고 싶습니다. 나는 내부로 들어가기 위해 엔터를 누른다.

$("#tags").autocomplete({ 
    source: names, 
    minLength: 0, 
    select: function(event, ui) { 
     var index = names.indexOf($(this).prop("value")); 
     $(this).val(""); 
     $("#selected").append("<li>"+names[index]+ 
     "<input type='hidden' id='id' value='"+ids[index]+"'/>"+ 
     "<a href=''>remove</a></li>"); 
     ids.splice(index, 1); 
     names.splice(index, 1); 
     return false; 
    } 
}).on("click", function(event) { 
    $(this).autocomplete("search", $(this).val()); 
}); 

정말로 enter와 mouse click의 차이점은 무엇입니까? 어떻게해야합니까?

+0

나는 이것이 버튼과 같은 클릭 가능한 요소에 대해 사실이라고 믿지만, 텍스트 상자에서는 입력이 다른 의미, 즉 리턴을 갖는다. 또한 스페이스 바를 클릭하는 대신 사용할 수 있습니다. – Mouser

+0

제출 버튼은 '기본'상태이며, 사용자가 에 도달하면 '클릭'됩니다. '제출'버튼을 추가하면 예상대로 작동합니다. – allnodcoms

답변

1

키 누르기 이벤트를 알아 내고 '입력'테스트는이 문제를 해결하는 가장 좋은 방법입니다. 이것이 없으면 버튼이 enter에서 실행되는 이유는 'submit'유형이기 때문입니다.

+0

제 코드의 실제 부분을 포함하도록 제 질문을 수정했습니다. 내가 선택한 사용자의 클릭 이벤트를 올바르게 처리 했습니까? 키보드에 관해서, 필자는 keypress 이벤트를 바인드하고 엔터 키를 올바르게 확인하기 만하면됩니까? – morbidCode

+0

나는 jquery에 너무 익숙하지 않아 첫 번째 부분을 손에서 벗어날 수는 없지만 두 번째 부분까지는 키 누르기를 바인딩하고 확인하는 것이 좋습니다. – Orangesandlemons

1

기본적으로 더 많은 노력없이 키보드 대체 방법을 사용할 수 없기 때문에 기본적으로 onClick을 편집 상자에서 실행하는 것은 좋지 않습니다.
당신이 저처럼 장님이기 때문에 (나는 당신의 질문에서 이것을 가정했습니다), 당신은 아마도 일부 스크린 독서 소프트웨어를 사용하고있을 것입니다. 화면 판독기에서 Enter는 일반적으로 마우스 클릭을 시뮬레이트하지만. 그러나 Windows 용 JAWS는 Enter 키를 누를 때 수행 할 작업을 조정할 수있는 유연성을 제공합니다. 마우스 클릭을 시뮬레이션하거나 시스템에 Enter 키를 보냅니다.
귀하의 경우에 onClick 이벤트를 발생시키는 버튼을 만들 수 있습니다.