jquery 토글() 메서드


  번역 결과:

toggle

영어 [ˈtɒgl] US [ˈtɑ:gl]

n. 올가미 전환 키;

jquery 토글() 메서드통사론

함수: toggle() 메서드는 선택한 요소의 클릭 이벤트에 차례로 응답하도록 두 개 이상의 이벤트 핸들러 함수를 바인딩하는 데 사용됩니다. 이 메서드는 선택한 요소의 hide() 및 show() 메서드를 전환하는 데에도 사용할 수 있습니다.

두 개 이상의 기능을 토글 이벤트에 바인딩: 지정된 요소를 클릭하면 두 개 이상의 기능 사이를 차례로 전환합니다. 세 개 이상의 함수가 지정되면 전환() 메서드는 모든 함수를 전환합니다. 예를 들어 함수가 세 개 있는 경우 첫 번째 클릭은 첫 번째 함수를 호출하고, 두 번째 클릭은 두 번째 함수를 호출하고, 세 번째 클릭은 세 번째 함수를 호출합니다. 네 번째 클릭은 첫 번째 함수를 다시 호출하는 방식입니다.

syntax : $ (selector) .toggle (function1 (), function2 (), functionn (), ...)

parameters :

parameters description
Function1 () 필수입니다. 해당 요소를 짝수번 클릭할 때마다 실행할 함수를 지정합니다.
function2() 필수입니다. 요소를 홀수번 클릭할 때마다 실행할 함수를 지정합니다.
functionN(),... 선택 사항. 전환해야 하는 다른 기능을 지정합니다.


Hide() 및 Show():
각 요소가 표시되는지 확인하세요. 요소가 숨겨져 있으면 show()를 실행합니다. 요소가 표시되면 요소 hide()입니다. 이는 전환 효과를 생성합니다.

구문: ​​$(selector).toggle(speed,callback)

매개변수:

매개변수 Description
speed 선택사항. 숨기기/표시 효과의 속도를 지정합니다. 기본값은 "0"입니다. 가능한 값: 밀리초(예: 1500) "느림" "보통" "빠름"
callback 선택 사항입니다. Toggle() 메서드가 완료되면 실행되는 함수입니다.


요소 표시 또는 숨기기:
일치하는 모든 요소만 표시할지 숨길지 지정합니다.

구문: ​​$(selector).toggle(switch)

매개변수:

ParametersDescription
switch 필수입니다. 토글()이 선택한 모든 요소만 표시할지 아니면 숨길지 지정하는 부울 값입니다. true - 요소 표시 false - 요소 숨기기

jquery 토글() 메서드예

<html>
<head>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").toggle(function(){
    $("body").css("background-color","green");},
    function(){
    $("body").css("background-color","red");},
    function(){
    $("body").css("background-color","yellow");}
  );
});
</script>
</head>
<body>
<button>请点击这里,来切换不同的背景颜色</button>
</body>
</html>
인스턴스 실행 »

온라인 인스턴스를 보려면 "인스턴스 실행" 버튼을 클릭하세요

인기 추천

비디오

Q&A