> 웹 프론트엔드 > JS 튜토리얼 > 다양한 브라우저가 캐리지 리턴 제출을 처리하는 방법

다양한 브라우저가 캐리지 리턴 제출을 처리하는 방법

WBOY
풀어 주다: 2016-05-16 18:34:40
원래의
1162명이 탐색했습니다.

조건은 다음과 같습니다.
IE 및 Firefox
1.

속성의 "action" 필드가 필요합니다.
2. ="제출" ".
Chrome 및 Safari에서
첫 번째 조건만 만족하세요. (참고 1)
따라서 제출 동작을 제어하려면(예: 제출하기 전에 필수 필드가 채워졌는지 확인) "input" 뒤에 Javascript "onXXX(예: onClick)"를 추가하면 됩니다. 유형="제출" 이벤트의 "입니다. 관련 필드를 감지하기 위해 비동기식 상호 작용을 사용해야 하는 경우 유효하지 않습니다. return false는 onreadystate=의 하위 함수이므로 전역 상황을 제어하지 않습니다. 이때 의 "onsubmit" 속성을 사용해야 합니다(참고 2). 예:
HTML

코드 복사 코드는 다음과 같습니다.

< form name=" form1" id="form1" action="act.php" method="post" onsubmit="myfn();return false;">

myfn()은 자체 정의 함수: 제출 방법(예: "입력"을 누르거나 type="submit"(type="button" 대신))을 사용하여 "입력" 버튼을 클릭하는 등 제출 방법에 관계없이 이 함수가 트리거됩니다. 따라서 type="submit"의 "input" 뒤에 Javascript 이벤트 "onXXX"를 추가할 필요가 없습니다. 제출 방법(onClick 등)을 제어하려는 의도가 아니라면 "onsubmit"에서 직접 제어하는 ​​것이 더 직관적이고 통합되어 있습니다.
마지막에 false를 반환하면 이 양식을 제출하지 않는다는 뜻입니다. 양식을 제출하는 문 document.form1.submit()은 myfn()의 선택 조건 분기로 사용될 수 있습니다.

요약:
이런 식으로 에는 "action" 및 "onsubmit" 속성이 있고 type="submit"의 "input" 제출 버튼이 있습니다. 어떤 브라우저에서든(불가능합니까? 피드백을 주십시오) "Enter" 키와 마우스를 사용하여 양식의 관련 필드를 비동기식(Ajax) 및 동기식(일반 Javascript)으로 확인하고 제출할 수 있습니다.
기타:
1. type="button"을 사용하여 관련 필드를 비동기적으로 감지하면 어떻게 될까요?
이런 방식으로 이 "입력"에는 이벤트 트리거가 있어야 합니다. IE 및 FF에서는 텍스트 상자에서 "Enter"를 직접 눌러 양식을 제출할 수 없습니다. 필요한 경우 추가 기능을 사용하여 사용자가 누르는 내용을 모니터링하고 응답해야 합니다(참고 3). 더 나쁜 점은 Ch 및 Sa에서 type="submit" 버튼이 있는지 여부가 무시되고 "action" 속성을 기반으로 양식이 직접 제출된다는 점입니다. 이러한 방식으로 예상한 탐지를 달성할 수 없습니다. 더 골치 아픈 결과가 발생할 수 있습니다.
2. “action” 속성을 작성하지 않고 양식을 비동기적으로 직접 제출하면 어떻게 되나요?
이런 식으로 양식을 단지 감지하는 대신 비동기적으로 제출하면 이 속성이 필요하지 않습니다. 그리고 그것은 여전히 ​​중복됩니다. 이것이 더 나은 사용자 경험을 제공할 수 있다면 어떨까요? 헤헤.
【설명】
1 IE8, FF, Ch에서 테스트되었으며 유효합니다. Opera와 Sa는 테스트되지 않았습니다.
코드 복사 코드는 다음과 같습니다.

Chrome에서 다음을 누르면 양식 제출이 시작됩니다.
양식의 Enter 키는 IE 또는 Firefox에서 Enter 키를 누르고 js를 사용하여 ajax 확인을 성공적으로 통과한 후 로그인 포트를 리디렉션할 수 있습니다. 사용자가 사용자 비밀번호를 입력하면 ajax가 됩니다. 현재 IE나 Firefox 모두 양식을 제출하지 않으며, Chorm과 Safari도 이때 입력한 모든 양식을 제출합니다.

향후 ajax를 사용한다면. ,

2 이 글
코드를 복사하세요 코드는 다음과 같습니다.

Chrome 브라우저에서 양식을 제출하려면 Enter 키를 누르지 마세요
이전에 포럼에 게시물을 게시하여 다음과 같이 질문했습니다.

"Chrome에서 브라우저
Enter 키를 변경하거나 무효화할 수 있습니다. " 결국 문제는 해결되지 않습니다.

양식을 제출하기 위해 Enter 키를 누르지 않아도 문제가 발생했습니다. 이제 문제가 해결되었습니다. 실제로는 매우 간단합니다. 제출 이벤트를 조작하는 양식에서

을 생각하지 않은 것에 대해 나 자신을 비난합니다.

onsubmit="MySubmit();return false;" >MySubmit()을 사용하여 제출할 때 판단을 내릴 수 있습니다. 예를 들어 숨겨진 다른 양식을 사용하여 사용자 정의된 제출 작업을 완료할 수 있습니다.

이 문제는 다소 헷갈리지만 Chrome에서 Enter 이벤트를 변경하는 것은 쉽지 않습니다.


3 이전 글 참고
IE와 FF에서 동시에 KeyCode 얻기
예전에 IE8에서 웹사이트를 테스트했는데, 그러다가 Ajax가 포함된 코드 일부가 오작동하고 Firefox와 해당 플러그인 Firebug는 FF가 windows.event 이벤트를 지원하지 않는다는 것을 발견했습니다. 그래서 마음을 바꿨습니다.
HTML

자바스크립트
코드 복사 코드는 다음과 같습니다.

function submit1(e){
var isie = (document.all) ? : false; //IE 커널인지 Mozilla인지 확인
var key;
if (isie)
key = window.event.keyCode;//IE는 windows.event 이벤트를 사용합니다
else
{
key = e.which;//세 가지 키 함수에는 e와 함께 여기에 전달되는 기본 숨겨진 변수가 있습니다. e.Mo 커널에 인덱스 값을 제공합니다(참고 1)
}
if(key==13)
send1('loginemail','loginpsw');//트리거된 이벤트를 사용자 정의할 수 있습니다.
}
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿