爲所有具有相同名稱的元素創建具有不同內容的JQuery彈出窗口

Question

我想讓JQuery彈出窗口的內容取決於元素的值。彈出窗口已創建，但沒有內容。這是我想什麼（它不生產用於內容的任何東西） JQuery的：

$("[name=teacher]").popover({ 
    title: 'Teacher', 
    content: $(this).attr('value'), 
    trigger: "hover" 
    }); 

HTML：

<div name="teacher" value="foo1">Bar1</div> 
<div name="teacher" value="foo2">Bar2</div> 

Answer 1

首先，價值和名稱是不是一個有效的屬性爲div元素。您應該使用的數據屬性和類名來代替：

<div class="teacher" data-value="foo1">Bar1</div> 

，您可以訪問數據屬性是這樣的：

$(this).data('value'); 

關於酥料餅的東西。 $（this）用於彈出窗口，而不是用於點擊的當前元素，這就是爲什麼內容是空的。您需要先手動觸發懸停功能，然後顯示酥料餅：

$(".teacher").hover(function() { 
    $(this).popover({ 
     content: $(this).data('value') 
    }).popover('show'); 
}, function() { 
    $(this).popover('hide'); 
}); 

演示：http://jsfiddle.net/LjmrG/

Answer 2

嘗試使用VAL（）函數...這樣的事情...

$(this).val(); 

可能工作...