2013-08-08 2 views
2

qtip2로 html 툴팁을 만들려고합니다. 그러나 사이트의 간단한 예를 따르면 방금 수업에 적응했습니다. 그러나 이것이 작동하지 않는 이유는 알 수 없습니다. 내가 .formreprovar'.tooltiptext에를 변경하는 경우 정상적으로 작동합니다. 감사Qtip2 플러그인이 HTML과 호환되지 않는 이유는 무엇입니까?

JSFIDDLE

JS

$(document).ready(function() 
{ 
$('.reprovar').qtip({ 
      position: { 
      my: 'bottom center', 
      at: 'top center' 
      }, 
      style: { 
       classes: 'qtip-light' 
      }, 
      content: { 
      button: 'close', 
      text: $(this).nextAll('.formreprovar').first() 
      }, 
      hide: { 
       fixed: true, 
       event: false 
      }, 
      show: { 
       event: 'click' 
      } 
     }); 
    }); 

HTML

<input type="button" value="Reprovar" class="btn btn-danger reprovar"> 
<div class="formreprovar"> 
<input type="text" /> 
<b>oiiiiiiiiiiii</b> 
</div> 

CSS

body { 
    padding: 50px; 
} 
.tooltiptext { 
    display: none; 
} 
.formreprovar { 
    display: none; 
} 

답변

2

0이

$(this).nextAll('.formreprovar').first().text() 

next은 선택의 바로 다음 형제를 가져보십시오. 이 후 발견되지 않는 경우 .formreprovar는 선택 후 .text() 부분을 잊지 마세요 또한

없는 반면, 그것이 바로 형제가 그대로 그냥 empty jQuery object

.next('.tootiptext') 작품이다. 문제가 text있어서 내부 this 컨텍스트처럼

Check Fiddle

UPDATE

보인다.

랩 그 문맥이 문제의 요소를 가리 키도록 함수 내부.

content: { 
     button: 'close', 
     text: function() { 
      return $(this).nextAll('.formreprovar').first() 
     } 
}, 

Working Fiddle

+0

Jsfiddle에서 작동하지만 내 응용 프로그램에서 작동하지. 고맙습니다. 어쨌든 –

+0

'HTML' 구조를 확인하고 가능한 경우 붙여 넣으십시오. –

+0

새로운 바이올린 및 코드로 편집되었습니다. 도와주세요 !! 감사!! –