[javascript] ENTER 키를 눌러 웹 양식을 제출하지 못하게하는 방법은 무엇입니까?
ENTER웹 기반 응용 프로그램에서 키 누르기가 양식을 제출 하지 못하게하려면 어떻게합니까 ?
답변
[ 개정 2012, 인라인 핸들러 없음, 텍스트 영역 입력 처리 유지]
function checkEnter(e){
e = e || event;
var txtArea = /textarea/i.test((e.target || e.srcElement).tagName);
return txtArea || (e.keyCode || e.which || e.charCode || 0) !== 13;
}
이제 <form […] onkeypress = “return checkEnter (event)”> 형식으로 키 누르기 핸들러를 정의 할 수 있습니다.
document.querySelector('form').onkeypress = checkEnter;
답변
다음은 제출 제출을 중지하고 백 스페이스 키-> 뒤로를 중지하는 데 사용할 수있는 jQuery 핸들러입니다. “keyStop”객체의 (keyCode : selectorString) 쌍은 기본 동작을 실행하지 않아야하는 노드를 일치시키는 데 사용됩니다.
웹은 접근하기 쉬운 장소 여야하며 이는 키보드 사용자의 기대를 상회하고 있습니다. 내 경우에는 작업중 인 웹 응용 프로그램이 뒤로 버튼을 좋아하지 않으므로 키 바로 가기를 비활성화하는 것이 좋습니다. “입력해야합니다-> 제출”토론은 중요하지만 실제 질문과는 관련이 없습니다.
접근성에 대해 생각하고 실제로 왜 그렇게하고 싶은지에 대한 코드는 다음과 같습니다!
$(function(){
var keyStop = {
8: ":not(input:text, textarea, input:file, input:password)", // stop backspace = back
13: "input:text, input:password", // stop enter = submit
end: null
};
$(document).bind("keydown", function(event){
var selector = keyStop[event.which];
if(selector !== undefined && $(event.target).is(selector)) {
event.preventDefault(); //stop event
}
return true;
});
});
답변
제출시 핸들러에서 단순히 false를 리턴하십시오.
<form onsubmit="return false;">
또는 중간에 처리기를 원한다면
<script>
var submitHandler = function() {
// do stuff
return false;
}
</script>
<form onsubmit="return submitHandler()">
답변
//Turn off submit on "Enter" key
$("form").bind("keypress", function (e) {
if (e.keyCode == 13) {
$("#btnSearch").attr('value');
//add more buttons here
return false;
}
});
답변
폼의 기본 제출 동작을 취소하면이 함수를 호출해야합니다. 모든 입력 필드 또는 이벤트에 첨부 할 수 있습니다.
function doNothing() {
var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode;
if( keyCode == 13 ) {
if(!e) var e = window.event;
e.cancelBubble = true;
e.returnValue = false;
if (e.stopPropagation) {
e.stopPropagation();
e.preventDefault();
}
}
답변
ENTER 키는 양식의 기본 제출 버튼 만 활성화합니다.
<input type="submit" />
브라우저는 양식 내에서 찾습니다.
따라서 제출 버튼이 없지만 다음과 같은 것이 있습니다.
<input type="button" value="Submit" onclick="submitform()" />
편집 : 의견 토론에 대한 답변 :
텍스트 필드가 하나만 있으면 작동하지 않지만이 경우 원하는 동작 일 수 있습니다.
다른 문제는 양식을 제출하기 위해 Javascript에 의존한다는 것입니다. 접근성의 관점에서 문제가 될 수 있습니다. <input type='button'/>
with with javascript 를 작성한 다음 태그 <input type='submit' />
안에 넣어서 해결할 수 있습니다 <noscript>
. 이 방법의 단점은 자바 스크립트가 비활성화 된 브라우저의 경우 ENTER에 양식을 제출한다는 것입니다. 이 경우 원하는 동작을 결정하는 것은 OP에 달려 있습니다.
나는 자바 스크립트를 전혀 호출하지 않고이 작업을 수행 할 수있는 방법을 모른다.
답변
순수한 자바 스크립트의 짧은 대답은 다음과 같습니다.
<script type="text/javascript">
window.addEventListener('keydown', function(e) {
if (e.keyIdentifier == 'U+000A' || e.keyIdentifier == 'Enter' || e.keyCode == 13) {
if (e.target.nodeName == 'INPUT' && e.target.type == 'text') {
e.preventDefault();
return false;
}
}
}, true);
</script>
입력 유형 = ‘text’에 대한 “Enter”키 누르기 동작 만 비활성화합니다. 방문자는 여전히 웹 사이트 전체에서 “Enter”키를 사용할 수 있습니다.
다른 조치에도 “Enter”를 사용하지 않으려면 console.log (e); 테스트 목적으로 크롬에서 F12 키를 누르고 “콘솔”탭으로 이동하여 페이지에서 “백 스페이스”를 누르고 내부를 살펴보고 어떤 값이 반환되는지 확인한 다음 해당 매개 변수를 모두 타겟팅하여 코드를 더욱 향상시킬 수 있습니다 “e.target.nodeName” , “e.target.type” 등에 대한 귀하의 요구에 적합합니다 .