jquery $(this).index() 질문드립니다. 채택완료
안녕하세요.
=== 첫번째 질문
아래 문장 똑같은게 5개가 있다고 하면
클릭한곳에 $(this).addClass 하면 정상적으로 잘 바뀌는데
idx=$(this).index(); 값은 항상 0으로만 표시됩니다.
클릭한곳 순번이 나오게 할려면 어떻게 해야 되나요?
=== 두번째 질문
아래처럼 똑같은 문장 5개가 있으나 클릭한곳만 글씨를
변경하고 싶은데 아래 처럼하면 5개 모두 변경이 됩니다.
3번째 문장만 바꾸고 싶으면 어떻게 해야 되나요?
$('.u_cbox_write_wrap .u_cbox_guide').text('주제 변경');
1.답글을 입력하세요
2.답글을 입력하세요
3.답글을 입력하세요 => 주제 변경
4.답글을 입력하세요
5.답글을 입력하세요
답변 1개
첫번째 질문
$(this).index(); 메서드는 현재 엘리먼트의 인덱스를 형제 엘리먼트 중에서 찾습니다. 그러나 문서에서 .u_cbox_write_wrap 클래스를 가진 단 하나의 엘리먼트만 있기 때문에 항상 0이 반환됩니다.
.u_cbox_write_wrap 클래스를 가진 모든 엘리먼트를 선택하고 그 중에서 현재 엘리먼트의 인덱스를 찾으려면 다음과 같이 할 수 있습니다:
javascript
var idx = $('.u_cbox_write_wrap').index(this);
두번째 질문
클릭한 엘리먼트만 텍스트를 변경하려면 $(this)를 사용하여 현재 엘리먼트를 찾은 다음 .find() 메서드를 사용하여 내부의 .u_cbox_guide 엘리먼트를 찾아야 합니다. 다음과 같이 할 수 있습니다:
</strong><button></button></p>
<p><code>$(this).find('.u_cbox_guide').text('주제 변경'); </code></p>
<p><strong>
수정된 스크립트
다음 스크립트는 위의 두 가지 변경 사항을 모두 적용한 것입니다:
</strong><button></button></p>
<p><code>$(document).on("click",".u_cbox_write_wrap",function(e){ var idx = $('.u_cbox_write_wrap').index(this); alert(idx); $(this).addClass('u_cbox_focus'); $(this).find('.u_cbox_guide').text('주제 변경'); }); </code></p>
<p><strong>
이제 클릭한 .u_cbox_write_wrap의 인덱스가 올바르게 표시되며, 클릭한 항목의 텍스트만 '주제 변경'으로 변경됩니다.
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
너무 잘되네요.