웹 프론트엔드 JS 튜토리얼 양식 포커스 이벤트를 처리하는 방법

양식 포커스 이벤트를 처리하는 방법

Sep 19, 2017 am 10:23 AM
이벤트 다루다 어떻게

오늘은 폼의 포커스 이벤트에 대해 설명하기 위해 텍스트 너비를 예로 들어 보겠습니다. 다른 폼 유형도 비슷합니다

Focus: 사용자가 입력한 개체를 구별하기 위해 브라우저는 사용자가 입력한 객체를 구별합니다. 요소에 포커스가 있으면 해당 요소는 사용자 입력을 받아들일 수 있습니다.

몇 가지 방법으로 요소에 포커스를 설정할 수 있습니다

1.tab

2,

3.js

을 클릭하세요. 모든 요소가 요소만 가능한 것은 아닙니다. 포커스를 받고 사용자 작업에 응답할 수 있는 태그에는 포커스가 있습니다(예: 양식, 태그

1

.tab). 말할 필요도 없이 브라우저는 포커스를 변경하기 위해 탭 키를 사용할 수 있습니다. 언제든지

2.클릭하여 초점을 맞추세요양식 요소를 클릭하면 클릭한 요소에 초점이 맞춰져 초점이 맞춰집니다

var aInp=document.getElementsByTagName('input');
            for(var i=0;i<aInp.length;i++){
                aInp[i].onfocus=function(){
                    this.value=' ';
                }
            };
로그인 후 복사


Lost focus onblur

사용법: 외부를 클릭할 때. 우리의 양식은 포커스를 잃고

focus

메서드를 사용하여 포커스를 얻기 위해 onblur

3.js를 트리거하고 blur 메서드를 사용하여 포커스를 잃습니다aInp[1].focus();

사용법:

Object.focus

이때 기본 포커스는 두 번째 형태입니다(blur도 마찬가지입니다)

**마지막으로 방법을 알려드리겠습니다

select

선택( ) 요소(사용자가 입력할 수 있는 요소) 전체 텍스트 내용 선택---> 복사 기능 구현

위 내용은 양식 포커스 이벤트를 처리하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 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)

CPU를 너무 많이 점유하는 WIN10 서비스 호스트의 동작 과정 CPU를 너무 많이 점유하는 WIN10 서비스 호스트의 동작 과정 Mar 27, 2024 pm 02:41 PM

CPU를 너무 많이 점유하는 WIN10 서비스 호스트의 동작 과정

CSV 파일 조작에 대한 빠른 가이드 CSV 파일 조작에 대한 빠른 가이드 Dec 26, 2023 pm 02:23 PM

CSV 파일 조작에 대한 빠른 가이드

iPhone 잠금 화면에서 예정된 캘린더 이벤트 받기 iPhone 잠금 화면에서 예정된 캘린더 이벤트 받기 Dec 01, 2023 pm 02:21 PM

iPhone 잠금 화면에서 예정된 캘린더 이벤트 받기

C# 개발에서 XML 및 JSON 데이터 형식을 처리하는 방법 C# 개발에서 XML 및 JSON 데이터 형식을 처리하는 방법 Oct 09, 2023 pm 06:15 PM

C# 개발에서 XML 및 JSON 데이터 형식을 처리하는 방법

PHP에서 특수 문자를 처리하고 작은따옴표를 변환하는 방법을 알아보세요. PHP에서 특수 문자를 처리하고 작은따옴표를 변환하는 방법을 알아보세요. Mar 27, 2024 pm 12:39 PM

PHP에서 특수 문자를 처리하고 작은따옴표를 변환하는 방법을 알아보세요.

PHP 프로젝트에서 달력 기능과 이벤트 알림을 구현하는 방법은 무엇입니까? PHP 프로젝트에서 달력 기능과 이벤트 알림을 구현하는 방법은 무엇입니까? Nov 02, 2023 pm 12:48 PM

PHP 프로젝트에서 달력 기능과 이벤트 알림을 구현하는 방법은 무엇입니까?

PHP7의 생성기: 대규모 데이터를 효율적으로 처리하고 메모리를 절약하는 방법은 무엇입니까? PHP7의 생성기: 대규모 데이터를 효율적으로 처리하고 메모리를 절약하는 방법은 무엇입니까? Oct 20, 2023 pm 04:42 PM

PHP7의 생성기: 대규모 데이터를 효율적으로 처리하고 메모리를 절약하는 방법은 무엇입니까?

PHP 개발 시 다중 언어 및 국제화 문제를 처리하는 방법 PHP 개발 시 다중 언어 및 국제화 문제를 처리하는 방법 Oct 09, 2023 pm 04:24 PM

PHP 개발 시 다중 언어 및 국제화 문제를 처리하는 방법

See all articles