通过 jQuery 添加 bootstrap 工具提示

Question

我将如何遍历 div 中的一些链接并根据它们的标题文本应用 Bootstrap 工具提示。所以例如我需要这个：

<a href="#" tile="link1">Link 1</a>
<a href="#" tile="link2">Link 2</a>
<a href="#" tile="link3">Link 3</a>

变成这样：

<a href="#" data-toggle="tooltip" data-placement="bottom" tile="link1">Link 1</a>
<a href="#" data-toggle="tooltip" data-placement="bottom" tile="link2">Link 2</a>
<a href="#" data-toggle="tooltip" data-placement="bottom" tile="link3">Link 3</a>

Answer 1

试试这个：-

$('a').each(function(){
  $(this).attr({
    'data-toggle': 'tooltip',
    'data-placement': 'bottom',
  }).tooltip();
});
 

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>



<a href="#" title="link1">Link 1</a>
<a href="#" title="link2">Link 2</a>
<a href="#" title="link3">Link 3</a> 

Answer 2

检查一下：

$('a').each(function () {

    $(this).data('toggle', 'tooltip');
    $(this).data('placement', 'bottom');

    $(this).tooltip()
});

//for disable :
$('a').each(function () { 
    $(this).removeAttr("data-toggle");
    $(this).removeAttr("data-placement");
    $(this).tooltip('disable');
});