웹 프론트엔드 JS 튜토리얼 JavaScript는 실수_javascript 기술을 통해 브라우저 뒤로 이벤트가 양식을 지우는 것을 방지합니다.

JavaScript는 실수_javascript 기술을 통해 브라우저 뒤로 이벤트가 양식을 지우는 것을 방지합니다.

May 16, 2016 pm 05:12 PM
javascript 브라우저

왜냐하면 대부분의 고객이 컴퓨터를 이해하지 못하는 초보자이기 때문입니다. 따라서 오작동이 많이 발생하며 텍스트 상자가 선택되지 않은 후 실수로 백스페이스를 누른 후 방금 열심히 작성했던 양식이 아무것도 아닌 상태로 돌아가는 경우가 있습니다. 인터넷에서 많은 정보를 확인한 뒤 정리했습니다. 모든 사람과 공유하세요. 또한 Sister Yogurt가 와서 내 첫 번째 기술 블로그를 읽어주기를 바랍니다. 하하(내가 당신에 대해 언급해도 괜찮습니다.). 더 이상 말도 안되는 소리는 없습니다. 소스코드 올립니다.

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

$(function(){
//키보드 이벤트 처리에서는 뒤로 키(백스페이스) 비밀번호나 한 줄 또는 여러 줄 텍스트 상자를 금지합니다.
function banBackSpace(e){
var ev = e || 이벤트 객체
var obj = ev.target || ev.srcElement;//이벤트 소스 가져오기

var t = obj.type || obj.getAttribute('type');// 이벤트 소스 유형

/ /판정 조건으로 사용되는 이벤트 유형 가져오기
var vReadOnly = obj.getAttribute('readonly')
var vEnabled = obj.getAttribute('enabled');
//null 값 상황 처리
vReadOnly = (vReadOnly == null) ? false : true;
vEnabled = (vEnabled == null) ? true : vEnabled; 백스페이스 키를 눌렀을 때 이벤트 소스 유형은 비밀번호 또는 한 줄, 여러 줄 텍스트입니다.
//readonly 속성이 true이거나 활성화 속성이 false인 경우 백스페이스 키가 유효하지 않습니다.
var flag1 =(ev.keyCode == 8 && (t=="password" | | t=="text" || t=="textarea")
&& (vReadOnly || vEnabled!=true))?true: false;

//백스페이스 키를 누르면 이벤트 소스 유형이 비밀번호나 단일 또는 여러 줄 텍스트가 아닌 경우 백스페이스 키가 비활성화됩니다.
var flag2=(ev.keyCode == 8 && t != "password" && t != "text" && t != "textarea ")
?true:false;

//Judge
if(flag2){
return false;
}
if(flag1){
return false ;
}
}

//Firefox 및 Opera에서 뒤로 키 비활성화
document.onkeypress=banBackSpace;
//IE 및 Chrome의 뒤로 키 비활성화
document.onkeydown=banBackSpace;
window.history.forward(1);//함께 제공되는 뒤로 버튼 차단 브라우저
})


주의할 사항은 다음과 같습니다.
이 코드는 초기화 메서드에 배치되어야 합니다. 그런 다음 document.onkeypress=banBackSpace를 사용하여 작성한 메소드를 호출하십시오.


vReadOnly = (vReadOnly == null) ? false : true ;이 코드에서는 콜론 뒤의 값이 vReadOnly<span style="font-family: Arial, Helvetica, sans-serif;">인 것으로 나타났습니다. 나중에 내 프로젝트에서 비어 있는 것을 발견했습니다. , null이 아니므로 true로 변경했습니다.


텍스트, 비밀번호, 텍스트 영역이 아닌 경우 백스페이스를 눌러 브라우저 백스페이스 이벤트를 방지하려면 위의 방법을 따르십시오. 그러나 텍스트 상자에 값. 이벤트. 이것은 내 첫 번째 블로그입니다. 많은 지원을 바랍니다.
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

뜨거운 기사 태그

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

부팅 시 브라우저가 자동으로 시작되도록 설정하는 방법은 무엇입니까? Win11이 시작될 때 브라우저를 자동으로 열려면 어떻게 해야 합니까? 부팅 시 브라우저가 자동으로 시작되도록 설정하는 방법은 무엇입니까? Win11이 시작될 때 브라우저를 자동으로 열려면 어떻게 해야 합니까? Jun 12, 2024 pm 07:58 PM

부팅 시 브라우저가 자동으로 시작되도록 설정하는 방법은 무엇입니까? Win11이 시작될 때 브라우저를 자동으로 열려면 어떻게 해야 합니까?

참깨 오픈 도어 공식 웹 사이트 참깨 오픈 도어 앱 최신 입력 웹 사이트 참깨 오픈 도어 공식 웹 사이트 참깨 오픈 도어 앱 최신 입력 웹 사이트 Feb 28, 2025 am 11:18 AM

참깨 오픈 도어 공식 웹 사이트 참깨 오픈 도어 앱 최신 입력 웹 사이트

Google Chrome 레지스트리를 지우고 Google Chrome 제거로 인해 남은 잔여물을 정리합니다. Google Chrome 레지스트리를 지우고 Google Chrome 제거로 인해 남은 잔여물을 정리합니다. Jun 19, 2024 am 11:09 AM

Google Chrome 레지스트리를 지우고 Google Chrome 제거로 인해 남은 잔여물을 정리합니다.

최신 버전의 참깨 오픈 도어 공식 웹 사이트 입구 게이트 .io 공식 웹 사이트 링크 주소 입구 최신 버전의 참깨 오픈 도어 공식 웹 사이트 입구 게이트 .io 공식 웹 사이트 링크 주소 입구 Feb 28, 2025 am 11:21 AM

최신 버전의 참깨 오픈 도어 공식 웹 사이트 입구 게이트 .io 공식 웹 사이트 링크 주소 입구

gate.io 참깨 문 다운로드 중국어 튜토리얼 gate.io 참깨 문 다운로드 중국어 튜토리얼 Feb 28, 2025 am 10:54 AM

gate.io 참깨 문 다운로드 중국어 튜토리얼

브라우저 네트워크 속도가 느린 이유 및 해결 방법(브라우저 네트워크 속도가 느린 이유 살펴보기) 브라우저 네트워크 속도가 느린 이유 및 해결 방법(브라우저 네트워크 속도가 느린 이유 살펴보기) Apr 25, 2024 pm 03:49 PM

브라우저 네트워크 속도가 느린 이유 및 해결 방법(브라우저 네트워크 속도가 느린 이유 살펴보기)

참깨 오픈 도어 교환 공식 웹 사이트 Gate.io Exchange 공식 웹 사이트 입구 참깨 오픈 도어 교환 공식 웹 사이트 Gate.io Exchange 공식 웹 사이트 입구 Feb 28, 2025 am 10:45 AM

참깨 오픈 도어 교환 공식 웹 사이트 Gate.io Exchange 공식 웹 사이트 입구

Ouyi Exchange 앱의 공식 설치 패키지 링크 다운로드 Ouyi Exchange 앱의 공식 설치 패키지 링크 다운로드 Mar 04, 2025 pm 06:45 PM

Ouyi Exchange 앱의 공식 설치 패키지 링크 다운로드

See all articles