2016-09-02 5 views
0

У меня есть этот элемент html, когда console.log их в моем коде.Как привязать всплывающие подсказки к этим элементам html

<span id="stamps[12]" class="stamps value widget-data tooltipstered" data-value="0.00" data-toggle="tooltip">0.00</span> 

Вот как я вызываю tooltipster. Но его не работает.

$($(htmlData)).find('[data-toggle="tooltip"]').each(function(v){ 
       console.log(this); 
       $(this).tooltipster(); 
      }); 
+0

Проверили ли вы ответ? – Dekel

+0

Да Это сработало для меня! Благодарю. @Dekel –

ответ

1

Если вы хотите, чтобы содержание tooltipster быть взяты из data-* атрибута, необходимо установить его внутри tooltipster конструктора (используйте атрибут content).

Вот пример:

$('[data-toggle="tooltip"]').each(function(v){ 
 
    console.log(this); 
 
    $(this).tooltipster({ 
 
    content: $(this).data('value') 
 
    }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tooltipster/3.3.0/css/tooltipster.min.css"> 
 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/tooltipster/3.3.0/js/jquery.tooltipster.min.js"></script> 
 
<span id="stamps[12]" class="stamps value widget-data tooltipstered" data-value="0.00" data-toggle="tooltip">0.00</span> 
 
<br /> 
 
<span id="stamps[13]" class="stamps value widget-data tooltipstered" data-value="12.23" data-toggle="tooltip">12.23</span>