獲取元素屬性並替換

Question

我正在使用boostrap彈出窗口來替換工具提示。而現在我得到這個

JS

$(function() { 
    $('[title]').attr("data-rel", "tooltip"); 
    var titlePopover = $("[data-rel='tooltip']").attr("title"); 
    $("[data-rel='tooltip']").removeAttr('title').attr("data-placement", "top").attr("data-content", titlePopover); 


    var showPopover = function() { 
     $(this).popover('show'); 
    }; 
    var hidePopover = function() { 
     $(this).popover('hide'); 
    }; 
    $("[data-rel='tooltip']").popover({ 
     trigger: 'manual' 
    }).click(showPopover).hover(showPopover, hidePopover); 

}); 

和HTML

<p title="THIS IS STEP 1">STEP 1</p> 
<p title="THIS IS STEP 2">STEP 2</p> 
<p title="THIS IS STEP 3">STEP 3</p> 
<p title="THIS IS STEP 4">STEP 4</p> 

這是工作好了，但現在的問題每一個元素都有相同的標題？

這裏正在撥弄 http://www.bootply.com/IUhlrnoHG5

Answer 1

目前您指定的唯一第一h1稱號。您可以使用使用

var titlePopover = $("[data-rel='tooltip']").attr("title"); 
$("[data-rel='tooltip']").removeAttr('title').attr("data-placement", "top").attr("data-content", titlePopover); 

DEMO

.attr(attributeName, function)

$("[data-rel='tooltip']") 
    .attr("data-placement", "top") 
    .attr("data-content", function() { 
     return this.title; //return $(this).attr("title") 
    }) 
    .removeAttr('title'); 

代替