Jquery)리스트 선택요소 css 변경_eq()

html 리스트 요소의 인덱스를 받아와서 css를 변경해야 할때가 있다.

 

예를 들어 나열되어있는 리스트를 클릭 했을때 색상을 변경해주는 등의 이벤트를 할 때 선택 요소의 css  변경이 필요하다.

그럴때는 eq() 함수를 이용하면 된다.

 

|사용 예시

	function listClick(e){
    	$(".mylist").find('li').eq($(e).index()).css('background-color','#f2f2f2');
    }

mylist 클래스의 li 태그 중에서 클릭한 인덱스의 css를 변경하는 예제이다. 

위의 예제에서는 선택한 리스트의 배경 색상을 #f2f2f2로 변경해주는 코드이다.

 

 

eq(인덱스) eq안에는 인덱스가 들어가는데, 클릭이벤트가 실행될때 클릭이벤트가 실행된 객체를 입력 받고, 입력받은 객체의 인덱스 값 $(e).index()을 eq 함수에 전달해주면 된다.