2010-04-13 4 views
1

테이블 셀 안에 스팬과 앵커가 있습니다. 툴팁을 표시하도록 앵커를 설정했습니다. 스팬 내의 텍스트를 툴팁에 사용하고 싶습니다. jQuery에서이 텍스트를 선택하려면 어떻게해야합니까?jQuery 선택기 질문

<td class="row-head" colspan="5"><span class="tip-text">Complete Coverage</span><a href="#" class="help"></a></td> 

JQuery 코드 - 현재 선택기는 항상 모든 팁에 대해서만 첫 번째 인스턴스를 찾습니다. 나는 고백한다

$(document).ready(function() { 
    $('.help').qtip({ style: { name: 'cream', tip: true }, 
       content: { 
       text: $(this).find('span.tip-text').html() 
    } }); 
}); 

감사

답변

4

귀하의 문제는 $(this)하는 문서 준비 기능의 맥락에서 평가되고있다, .each() 함수를 사용하여 각 .help을 반복 할 수 있습니다. .tip-text을 찾으려는 기능은 .prevAll() 또는 .siblings() 일 수 있습니다.

$(document).ready(function() { 
    $('.help').each(function() { 
    // iterate over each .help, find its span.tip-text and create the qtip 
    $(this).qtip({ 
     style: { name: 'cream', tip: true }, 
     content: { 
     text: $(this).siblings('span.tip-text').html() 
     } 
    }); 
    }); 
}); 
+0

도움 주셔서 감사합니다! – Jakey

0

는 (아직)이 테스트하지 데, 그러나 이것은 당신이 당신의 테이블의 각 행에 대해이 작업을 반복 할 수, 스팬 내용을 가져 오기합니다.

$('a.help').siblings('.tip-text').text(); 
+0

'.tip-text'는 부모가 아닌'.help'의 형제이기 때문에'closest()'는 도움이되지 않습니다. – gnarf

+0

Ta, wasnt 한 생각! – Duncan

+0

Duncan에게 마지막 작품을 보내 주셔서 감사합니다! 덕분에 응답 한 모든 사람에게 반복이 핵심이되었습니다. – Jakey

0
$(document).ready(function() { 
    $('.help').qtip({ 
     style: { name: 'cream', tip: true }, 
     content: { text: $(this).parent().find('span.tip-text').text(); } 
     }); 
}); 

난 그냥 자동으로 툴팁으로

0
$(this).parent().find('span.tip-text'); 

그냥 후손을 찾습니다 찾기 것을 사용하므로

<a href="#" class="help" title='Complete Coverage'></a> 

및 qtip 같은 앵커의 제목 속성을 사용하는 것이 좋습니다 것이지만 선택한 요소 중 하나라고 생각합니다.

http://api.jquery.com/find/

2

문제는 this의 사용이다. 나는 최근에 일치하는 모든 객체에 대해 루프가 암시한다고 가정 할 때 동일한 상황에 처했다.

사실, 그렇지 않습니다. this도움말 클래스의 현재 요소를 나타내지 않습니다. 당신이 정말로 현재 일치하는 요소를 기반으로 뭔가를해야 할 경우

, 당신은이 같은 each() 기능을 사용해야합니다

$('.help').each(function(idx) { 
    $(this).qtip({ 
     style: { name: 'cream', tip: true }, 
     content: { text: $(this).find('span.tip-text').html() } 
    }); 
}); 
+0

'$ (this) .qtip() '대신에'.help'에 qtip을 다시 붙이기 때문에 각각이 깨질 것입니다. – gnarf

+0

감사합니다 :). 고정 –