Bootstrap Popover Отображение того же содержимого

Question

Кто-нибудь работал с загрузчиком popover? Мне трудно выполнить это.

Я создаю миниатюры фильмов динамически, и на мероприятии mouseenter я использую popover для отображения деталей изображения. Проблема в том, что для всех изображений отображаются одни и те же детали.

Вот какая-то часть моего кода:

<script> 
    $(function() { 
     $(".get-movies").click(getEventHandler); 
    }); 

    function getEventHandler() { 
     var name = $(".get-movie-name").val(); 

     $.ajax({ 
      url: "http://api.rottentomatoes.com/api/public/v1.0/movies.json?apikey=my_key&q=" + name + "&page_limit=5", 
      dataType: "jsonp", 
      success: function (response) { 
       $(".display-movie").empty(); 
       var ul = $(".display-movie"); 
       for (var i = 0; i < response.movies.length; i++) { 
        var img = $("<img>").attr("src", response.movies[i].posters.original) 
             .attr("id", i) 
             .attr("data-placement", "right") 
             .attr("class", "img-popover") 
             .on("mouseover", response, getPopOver) 
             .on("mouseout", hidePopOver) 
            .css({ 
             width: 200, 
             height: 200, 
             margin: 20 
            }); 

        var div = $("<div>") 
         .append(img) 
        $("<li>") 
         .append(div) 
         .appendTo(ul); 
       } 
      } 
     }); 
    } 

    function getPopOver(info) { 
     console.log(info); 
     var image = '<img src = " ' +info.data.movies[info.target.id].posters.thumbnail+ ' " />'; 
     $(".img-popover").popover({ 
      title: info.data.movies[info.target.id].title, 
      content: image, 
      trigger: "hover", 
      html: true 
     }) 
    } 


    function hidePopOver() { 
     console.log("Leaving here"); 
     $(".img-popover").popover("hide"); 
    } 
</script> 

Answer 1

Я думаю, что ваш:

var name = $(".get-movie-name").val(); 

возвращает первый элемент в коллекции элементов, которые соответствуют этому классу.

вы можете попробовать:

var name = $('#' +this.id + ".get-movie-name").val(); 

, но не видя некоторые HTML, я не могу быть точным здесь.