Atomic Habits

JQuery - n번 째 제외 :not(:nth-child(n)) / 특정 요소 포함하는 has() 본문

IT/JavaScript-JQuery

JQuery - n번 째 제외 :not(:nth-child(n)) / 특정 요소 포함하는 has()

체계성 2022. 9. 20. 16:15

https://zxchsr.tistory.com/107

https://focus-on-my.tistory.com/57

 

[jQuery] DOM 요소 필터링 - 필터선택자

:button, :checkbox, :password . . .  -> 이런식으로 요소별로 있음. 잘 안씀 - 위치기반 필터 선택자 설명 :first 첫 번째 요소 선택 :last 마지막 요소 선택 :first-child 첫 번째 자식 요소 선택 :last-child..

focus-on-my.tistory.com

 

[JQuery] table tr onclick event 특정 td만 제외 / <tr> onclick 이벤트 특정 <td> 제외

■ JQuery table tr onclick event 특정 td만 제외 / onclick 이벤트 특정 제외 ■ 예제 테이블 아이디 비밀번호 test 1234 ■ 사용법 # 예제 1 (첫번째 td를 제외한 나머지 td 클릭 시 콘솔 1이 찍힘) - 'tr td:n..

zxchsr.tistory.com

■ JQuery table tr onclick event 특정 td만 제외 / <tr> onclick 이벤트 특정 <td> 제외


 예제 테이블

<table id="testTable">
  <thead>
    <tr>
      <th></th>
      <th>아이디</th>
      <th>비밀번호</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td></td>
      <td>test</td>
      <td>1234</td>
    </tr>
  </tbody>
</table>

■ 사용법

# 예제 1 (첫번째 td를 제외한 나머지 td 클릭 시 콘솔 1이 찍힘) - 'tr td:not(:first-child)'

  • 2(n)번째 td를 제외하고 싶을 경우 - 'tr td:not(:nth-child(2))'
  • 마지막 td를 제외하고 싶을 경우 - 'tr td:not(:last-child)'
<script type="text/javascript">
  $(document).ready(function() {
    $('#testTable tbody').on('click', 'tr td:not(:first-child)', function () {
    	console.log('1');
    });
  });
Comments