[jquery] Index 값 찾기

[jquery] Index 값 찾기 updated_at: 2024-07-30 19:01

Index 값 찾기

jquery 를 사용하면 가장 편리한 것이 특정 요소로 바로 찾아 가는 기능이다.
보통 리스트중 현재 클릭한 것은 열고 다른 것은 닫게하는(자주묻는 질문과 같은)데 이런 요소는 편리성을 준다.

방법

$("[Element]").on('click', function(){
  var index = $("[Element]").index(this);
});

예제 1

$("div").on('click', function() {
  var index = $("div").index(this); // 현재 클릭이 발생한 $("div") 가 문서내의 모든 div에서 몆번째인지 확인
  $("span").text( "That was div index #" + index );
});

예제 2

.eq(index) 와 함께 사용하면 좋습니다. jQuery part

$(".btn_click").on('click', function(){
  var i = $(".btn_click").index(this);
  $(".submenu").hide();
  $(".submenu").eq(i).show(); //메서드
});

HTML part

<div class='btn_click'>메뉴1</div>
<div class='submenu'>설명1</div>
<div class='btn_click'>메뉴2</div>
<div class='submenu'>설명2</div>
<div class='btn_click'>메뉴3</div>
<div class='submenu'>설명3</div>
<div class='btn_click'>메뉴4</div>
<div class='submenu'>설명4</div>

See the Pen jQuery - Find index by younghyeong ryu (@wangta69) on CodePen.

Table of contents 목차

평점을 남겨주세요
평점 : 5.0
총 투표수 : 1

질문 및 답글