>웹 프론트엔드 >JS 튜토리얼 >JavaScript 구성요소 포커스와 인페이지 앵커 포인트_javascript 기술 간 값을 전달하는 방법

JavaScript 구성요소 포커스와 인페이지 앵커 포인트_javascript 기술 간 값을 전달하는 방법

WBOY
WBOY원래의
2016-05-16 16:16:251496검색

이 기사의 예에서는 JavaScript 구성 요소의 포커스와 페이지의 앵커 포인트 간에 값을 전송하는 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 분석은 다음과 같습니다.

위의 두 가지 작은 기능은 일부 새로운 휴대폰 페이지에서 매우 유용합니다.

입력 상자에 커서를 놓을 때 이벤트를 트리거하고 입력 상자를 떠날 때 다른 이벤트를 트리거하는 방법은 무엇입니까? 사용자가 아무것도 입력하지 않아도…

페이지 간 값을 전달하는 방법은 매우 간단하지만 페이지 내 앵커 포인트 간 값을 전달하는 방법은 무엇입니까?

1. 기본 목표

입력 상자와 하이퍼링크가 있는 페이지가 있습니다. 이 두 가지는 전혀 관련이 없습니다.

기능이 크지 않아서 두 기능을 합쳐서 작성했습니다

1. 입력창 기능

대화 상자 배경에 커서를 놓으면 빨간색으로 변하고, 다른 곳에서 마우스를 클릭하면 다시 회색 배경으로 변합니다

2. 하이퍼링크 기능

get 메소드를 통해 페이지 하단의 하단 앵커 포인트에 text=1 값을 전달합니다. 하단 앵커 포인트 아래에는 주소 표시줄의 텍스트 매개변수를 계속 폴링하는 비활성화된 입력 상자가 있습니다.

처음에 클릭하지 않으면 텍스트 매개변수가 없으므로 입력창이 항상 null로 표시됩니다

하이퍼링크를 클릭하면 0.5초 후에 다음 대화 상자가 1로 변경됩니다. 밀리초 단위로 처리되기 때문에 사용자의 인식이 실시간으로 처리됩니다.

비활성화된 항목 위에는 페이지의 매개변수 전송을 지우는 뒤로 하이퍼링크가 있습니다. 스크롤 막대를 다시 내리면 다시 null로 표시됩니다.

페이지 내의 앵커 포인트 간에 값이 성공적으로 전송되면 브라우저의 URL은 다음과 같습니다.

2. 제작과정

플러그인을 소개할 필요가 없습니다. HTML 페이지를 열어서 작성하면 됩니다.

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











  • 성명:
    본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.