jQuery 이벤트 - toggle() 메서드

예제

다른 배경색을 전환하십시오:

"$\(p\)".toggle(
  function(){
  "$\(body\)".css("background-color","green");
  function(){
  $("body").css("background-color","red");}
  function(){
  $("body").css("background-color","yellow");}
);

직접 테스트해 보세요

정의 및 사용법

toggle() 메서드는 두 개나 더 많은 이벤트处理器 함수를 바인딩하여 선택된 요소의 차례로 click 이벤트에 응답합니다.

이 메서드는 선택된 요소의 hide()show() 메서드.

Toggle 이벤트에 두 개나 더 많은 함수를 바인딩합니다

지정된 요소가 클릭될 때, 두 개 또는 더 많은 함수 사이에서 차례로切换됩니다.

두 개 이상의 함수가 지정되면 toggle() 메서드는 모든 함수를切换합니다. 예를 들어, 세 가지 함수가 존재하면 첫 번째 클릭은 첫 번째 함수를 호출하고, 두 번째 클릭은 두 번째 함수를 호출합니다. 세 번째 클릭은 다시 첫 번째 함수를 호출합니다. 이렇게 계속됩니다.

문법

$(선택자).toggle(function1(),function2(),functionN(),...)

직접 테스트해 보세요

파라미터 설명
function1() 필수. 요소가 각 홀수 번째 클릭될 때 실행되는 함수를 지정합니다.
function2() 필수. 요소가 각 짝수 번째 클릭될 때 실행되는 함수를 지정합니다.
functionN(),... 선택적.切换에 필요한 다른 함수를 지정합니다.

toggle Hide()와 Show()

각 요소가 보이는지 확인합니다.

요소가 숨겨져 있으면 show()를 실행합니다. 요소가 보이면 hide()를 실행합니다. 이렇게切换 효과를 만들 수 있습니다.

문법

$(선택자).toggle(속도,callback)

직접 테스트해 보세요

파라미터 설명
속도

선택적. hide/show 효과의 속도를 지정합니다. 기본 값은 "0"입니다.

가능한 값:

  • 밀리초(예: 1500)
  • "slow"
  • "normal"
  • "fast"
callback

선택적. toggle() 메서드가 완료될 때 실행되는 함수.

callback에 대한 더 많은 정보를 배우기 위해 우리의 Callback 함수 튜토리얼

요소 표시 또는 숨기기

모든 일치하는 요소를 표시하거나 숨기는지 지정합니다.

문법

$(선택자).toggle(switch)

직접 테스트해 보세요

파라미터 설명
switch

필수. 부울 값, toggle()가 모든 선택된 요소를 표시하거나 숨기는지 지정합니다.

  • true - 요소 표시
  • false - 요소 숨기기