Bootstrap modal Fehler

Question

Ich versuche, ein bootstrap modal zu haben, die on click aufgrund eines besonderen buttons angezeigt wird, die in dem Abschnitt in jQuery dynamisch durch insertAfter() Funktion erzeugt werden. Ich habe einen Abschnitt, der auf Schweben über die Grenze gibt und während auf dem Abschnitt Schaltflächen klicken angezeigt werden, wie Sie in den following link sehen können ich eine jQuery-Funktion zum Erzeugen von Tasten als

$('#page-wrapper').find('[data-nitsid]').each(function() { 

    var nits = $(this).data("nitsid"); 
    $("<div id='" + nits + "' class='clearfix' style='display: none;'><a href='#' class='btn btn-circle btn-sm default sorthandle'>Sort <i class='fa fa-arrows'></i></a><a href='#nitsedit" + nits + "' role='button' data-toggle='modal' class='btn btn-circle btn-sm default'> Edit <i class='fa fa-pencil-square-o'></i></a><a href='#clone" + nits + "' class='btn btn-circle btn-sm default'> Clone <i class='fa fa-clone'></i></a><a href='#delete" + nits + "' class='btn btn-circle btn-sm default'> Delete <i class='fa fa-trash'></i></a></div>").insertAfter(this); 
}); 

platziert habe und ein mit entsprechend modal:

<div class="modal fade modal-primary in" id="nitsedit3" tabindex="-1" data-backdrop="static" data-keyboard="false" role="dialog" aria-labelledby="nitseditlabel" style="padding-right: 17px;"> 
    <div class="modal-dialog" role="document" style="width: 300px;"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true"><i class="fa fa-times fa-lg"></i></span></button> 
       <h4 class="modal-title" id="portlets_modal_label">Navigation</h4> 
      </div> 
     <div class="modal-body" id="portlets_modal_body" style="height: auto; overflow: auto;"> 
     . 
     . 
     . 
     </div> 
      <div id="portlets_modal_footer" class="modal-footer"> 
       <button type="button" class="btn btn-primary">Add Pages</button> 
      </div> 
     </div> 
    </div> 
</div> 

die buttons sind nicht in der Lage, die modal angezeigt werden, die ich sehen kann sowohl die id's gleich ist, habe ich die bootstrap library richtig aufgenommen, auch habe ich versucht, schiebe Z-index aber ich bin nicht in der Lage der angezeigt werden modal. Ich habe versucht, in JSBin Editor zu laufen, und es arbeitet dort drüben.

Answer 1

Ich denke, das Problem ist, dass, da Sie diese Anker dynamisch hinzufügen, werden Sie das Click-Ereignis auf das Dokument selbst binden müssen:

jQuery

$('document').on('click', 'a[data-toggle="modal"]', function() { 
    var modalId = $(this).attr('href'); 
    $(modalId).modal('show'); 
});