동적으로 생성 된 버튼을위한 부트 스트랩 팝업 버튼

Question

나는 jquery에서 여기에 맞습니다. 나는 아들이있다. json의 항목 수를 기반으로 버튼을 만듭니다. Popover는 해당 버튼에 마우스를 올리면 표시되지 않습니다. 도와주세요. 나는 실수를 어디에서하고 있는지 모른다. 그리고 디버깅에 어떤 생각이 없습니다. 제안 ...

<style type="text/css"> 
    @IMPORT url("bootstrap.css"); 
</style> 

<script src="bootstrap.js"></script> 

$(document).ready(function() 
{ 
    $.getJSON('http://localhost/3s/Sample/JsonCreation.php', function(data) 
    { 
     questionsArray = data; 
     variable = 1; 
     for (var question in questionsArray) 
     { 
      var button = $("<input>").attr("type", "button").attr("id", "buttonWithQNo").attr("class", "btn btn-default").attr("data-title", "title").attr("data-content", "content").val(variable); 
      $('#questionButtonsDiv').append(button); 
      $('#questionButtonsDiv').append(" "); 
      variable++; 
     } 

    }); 
    $('#buttonWithQNo').popover({trigger: 'hover'});  
}); 

편집하십시오 - 나는 요소가 문서 모델에 추가되기 전에도 호버 액션이 추가되는 것을 이해합니다. 하지만 마우스를 움직여야하는 동작은 어디에 추가해야합니까? 그리고 난 모든 버튼에 필요한 PS (모든 팝 오버에 제목과 내용은 고유 -의 값은 JSON에서 유래한다)

Answer 1

이

$(document).ready(function() 
{ 
    $.getJSON('http://localhost/3s/Sample/JsonCreation.php', function(data) 
    { 
     questionsArray = data; 
     variable = 1; 
     for (var question in questionsArray) 
     { 
      var button = $("<input>").attr("type", "button").attr("class", "btn btn-default buttonWithQNo").attr("data-title", "title").attr("data-content", "content").val(variable); 
      $('#questionButtonsDiv').append(button); 
      $('#questionButtonsDiv').append(" "); 
      variable++; 

      // 
      $(button).popover({trigger: 'hover'}); 
     } 


    });  
}); 

확인을 시도 ... fiddle