자식 클래스를 클릭하여 클래스의 부모 ID를 가져옵니다.

스티브 8428

<div>아래와 같이 4 개의 컨테이너가 있습니다.

 <div class="parentBox">
  <div class="childBox" id="20">
      <div>some content with in this div</div>
      <div>another div with more sontent</div>
  </div>
</div>

childBox div 내에서 아무 곳이나 클릭 할 때 childBox ID를 jQuery 변수로 가져오고 싶습니다. 나는 나에게주는 다음을 시도했다undefined

 $('.parentBox').click(function (event) {
    var id = $(this).attr('id');
    console.log(id);
});

나에게 부모를 준 이것은 기능이 아닙니다.

var id = $(this).parent().attr('id');

콘솔 로그에 공백이 표시되는 이것을 시도했습니다.

var id = event.target.id;

누군가 도와 주시겠습니까?

     $('.parentBox').click(function (event) {
        var id = $(this).attr('id');
        console.log(id);
        
        //does not work
        console.log($(this).parnet().attr('id'));
        
        //also does not work
        console.log(event.target.id);
    });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="parentBox">
      <div class="childBox" id="20">
          <div>some content with in this div</div>
          <div>another div with more sontent</div>
      </div>
    </div>

고란 ​​스토야노프

div를 .childBox클릭 할 때 ID 를 원하는 경우 클래스 .childBox에서 클릭 이벤트를 연결할 수 있습니다 .childBox.

$('.childBox').click(function (event) {
    var id = $(this).attr('id');
    console.log(id);
});

편집하다:

.childBoxfrom .parentBox이벤트 에 액세스하려면 다음을 수행하십시오.

$('.parentBox').click(function (event) {
    var id = $(this).find('.childBox').attr('id');
    console.log(id);
});

동적으로 자식을 추가 할 때 다음과 같이 부모 또는 문서 개체에 이벤트를 연결하는 것이 좋습니다.

$(document).on('click', '.childBox' , function() {
  console.log($(this).attr('id'));
});

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

현재 실행의 부모 클래스를 상속하는 자식 클래스의 모듈 이름을 가져옵니다.

Python은 부모 클래스 정적/클래스 메서드 내에서 자식 클래스를 가져옵니다.

부모의 자식 클래스의 데이터를 부모가 같은 다른 클래스로 복사

Rails STI가 자식 클래스 대신 부모 클래스를 가져옴

PHP는 부모 클래스의 실제 인스턴스 인 자식 클래스를 만듭니다.

여러 클래스 이름을 선택하고 PHP DOMXpath를 사용하여 해당 클래스 내부에 자식 노드를 가져옵니다.

요소 jQuery를 클릭하면 부모 양식 클래스 가져 오기

부모 클래스 생성자를 재정의하는 자식 클래스 멤버 이니셜라이저

Java 자식 클래스가 부모 클래스의 추상 메서드를 구현할 수 없습니다.

자식 클래스의 객체를 생성하면 부모 클래스의 객체 생성이 있습니까?

C ++ 자식 클래스는 부모 클래스를 확장합니다.

다른 클래스 PHP에서 양식 클릭의 모든 ID 값을 가져옵니다.

Django : 두 개의 다른 자식 클래스가 동일한 부모 클래스를 가리킴

부모 클래스 개체에서 자식 클래스를 구별합니까?

jquery를 통해 부모 ID를 가져와 자식 ID를 클릭 한 다음 자식 ID를 클릭하여 부모 ID를 찾는 방법

C ++의 부모 클래스에서 자식 클래스로 데이터를 상속 할 수 없습니다.

Jackson은 자식 클래스를 부모 클래스의 필드로 직렬화합니다.

주어진 부모 클래스 내에서 자식 클래스의 특정 메서드를 반복합니다.

부모 클래스 만 변경하여 자식 클래스를 변경하는 방법은 무엇입니까?

자식 클래스의 생성자를 사용하여 부모 클래스 개체를 인스턴스화 할 수있는 이유는 무엇입니까?

기본 클래스의 모든 하위 클래스를 기본 클래스의 클래스 속성으로 가져옵니다.

부모 클래스에서 자식 클래스를 반환

자식 클래스를 추상 부모 클래스로 반환

JAVA에서 부모 클래스의 객체를 사용하여 자식 클래스의 생성자를 호출하는 방법이 있습니까?

자식 클래스에서 재정의 된 부모 클래스 메서드를 어떻게 호출합니까?

자식 클래스는 부모 클래스의 고유 한 개체 필드를 설정해야합니까?

C #의 부모 클래스 목록에서 지정된 자식 클래스를 찾을 수 있습니까?

부모 클래스에서 상속 된 자식 클래스의 함수는 그 변수를 사용합니까?

부모 클래스 안에 자식 클래스의 객체를 어떻게 만들 수 있습니까?

TOP 리스트

  1. 1

    JNDI를 사용하여 Spring Boot에서 다중 데이터 소스 구성

  2. 2

    std :: regex의 일관성없는 동작

  3. 3

    JSoup javax.net.ssl.SSLHandshakeException : <url>과 일치하는 주체 대체 DNS 이름이 없습니다.

  4. 4

    PrematureCloseException : 연결이 너무 일찍 닫혔습니다.

  5. 5

    Xcode10 유효성 검사 : 이미지에 투명성이 없지만 여전히 수락되지 않습니까?

  6. 6

    정점 셰이더에서 카메라에서 개체까지의 XY 거리

  7. 7

    Ionic 2 로더가 적시에 표시되지 않음

  8. 8

    Seaborn에서 축 제목 숨기기

  9. 9

    C #에서 'System.DBNull'형식의 개체를 'System.String'형식으로 캐스팅 할 수 없습니다.

  10. 10

    복사 / 붙여 넣기 비활성화

  11. 11

    ArrayBufferLike의 typescript 정의의 깊은 의미

  12. 12

    Google Play Console에서 '예기치 않은 오류가 발생했습니다. 나중에 다시 시도해주세요. (7100000)'오류를 수정하는 방법은 무엇입니까?

  13. 13

    Kubernetes Horizontal Pod Autoscaler (HPA) 테스트

  14. 14

    jfreecharts에서 x 및 y 축 선을 조정하는 방법

  15. 15

    PRNG 기간보다 순열이 더 많은 목록을 무작위로 섞는 방법은 무엇입니까?

  16. 16

    C # HttpWebRequest 기본 연결이 닫혔습니다. 전송시 예기치 않은 오류가 발생했습니다.

  17. 17

    다음 컨트롤이 추가되었지만 사용할 수 없습니다.

  18. 18

    잘못된 구성 개체입니다. Webpack이 Angular의 API 스키마와 일치하지 않는 구성 개체를 사용하여 초기화되었습니다.

  19. 19

    Android Kotlin은 다른 활동에서 함수를 호출합니다.

  20. 20

    R의 마침표와 숫자 사이에 문자열 삽입

  21. 21

    Assets의 BitmapFactory.decodeStream이 Android 7에서 null을 반환합니다.

뜨겁다태그

보관