Как привязать загрузчик popover к динамическим элементам
Я использую всплывающее окно Twitter Bootstrap в динамическом списке. У элемента списка есть кнопка, когда я нажимаю кнопку, он должен появиться всплывающее окно. Он отлично работает, когда я тестировал на нединамических.
это мой JavaScript для нединамического списка
$("button[rel=popover]").popover({
placement : 'right',
container : 'body',
html : true,
//content:" <div style='color:red'>This is your div content</div>"
content: function() {
return $('#popover-content').html();
}
})
.click(function(e) {
e.preventDefault();
});
Тем не менее, он не работает хорошо в динамическом списке. Он может отображаться, когда я нажимаю кнопку «дважды», и отображать только один из элементов списка, которые я нажимаю в первый раз.
МОЙ HTML
<ul id="project-list" class="nav nav-list">
<li class='project-name'>
<a >project name 1
<button class="pop-function" rel="popover" ></button>
</a>
</li>
<li class='project-name'>
<a>project name 2
<button class="pop-function" rel="popover" ></button>
</a>
</li>
</ul>
<div id="popover-content" style="display:none">
<button class="pop-sync"></button>
<button class="pop-delete"></button>
</div>
Мой JavaScript для динамического:
$(document).on("click", "#project-list li" , function(){
var username = $.cookie("username");
var projectName = $(this).text()
$("li.active").removeClass("active");
$(this).addClass("active");
console.log("username: " +username + " project name: "+projectName );
});
$(document).on("click", "button[rel=popover]", function(){
$(this).popover({
placement : 'right',
container : 'body',
html : true,
content: function() {
return $('#popover-content').html();
}
}).click(function(e){
e.preventDefault();
})
});
//for close other popover when one popover button click
$(document).on("click", "button[rel=popover]" , function(){
$("button[rel=popover]").not(this).popover('hide');
});
Я искал похожие проблемы, но все еще не могу найти ту, которая решит мою проблему. Если у кого-то есть идеи, пожалуйста, дайте мне знать. Спасибо за вашу помощь.