如何从bootbox对话框中的html内容调用JS函数？

Question

代码是在bootbox对话框中动态生成新行，该对话框是从JQuery Function调用的。但是为了添加新行，JS函数$("#add_row").click(function()在以这种方式放置时不起作用。 有人可以帮忙吗？

代码＃1（JQuery：显示引导框对话框） 显示部分#quick_parameter_table。

  $( "body" ).on( "click", ".js-quick-parameter-entry", function(event) {

         var msg = $('#quick_parameter_table').html();

           bootbox.dialog({  
              title: "Add the parameter values?",
                message: msg,
                buttons: {
                   success: {
                       label: "Submit",
                       className: "btn-success",
                       callback: function () {      


                       }}}
                       });
                       });

本节'quick_parameter_table'是从JQuery函数调用的。 这包含用于动态地向表中插入新行的ode，在“添加行”按钮中使用#add_row调用该行。

代码＃2

<section id="quick_parameter_table" style="display: none;">
            <table class="table table-bordered table-hover" id="tab_logic">
                <tbody>
                    <tr id='addr0'>
                        <td>
                        1
                        </td>
                        <td>
                        <input type="text" name='name0'  placeholder='Name' class="form-control"/>
                        </td>
                        <td>
                        <input type="text" name='mail0' placeholder='Mail' class="form-control"/>
                        </td>
                        <td>
                        <input type="text" name='mobile0' placeholder='Mobile' class="form-control"/>
                        </td>
                    </tr>
                    <tr id='addr1'></tr>
            </tbody>
            </table>

    <a id="add_row" class="btn btn-default pull-left">Add Row</a><a id='delete_row' class="pull-right btn btn-default">Delete Row</a>
</div>
    </section>

JS函数添加新行。

代码＃3

     $(document).ready(function(){
      var i=1;
     $("#add_row").click(function(){
      $('#addr'+i).html("<td>"+ (i+1) +"</td><td><input name='name"+i+"' type='text' placeholder='Name' class='form-control input-md'  /> </td><td><input  name='mail"+i+"' type='text' placeholder='Mail'  class='form-control input-md'></td><td><input  name='mobile"+i+"' type='text' placeholder='Mobile'  class='form-control input-md'></td>");

      $('#tab_logic').append('<tr id="addr'+(i+1)+'"></tr>');
      i++; 
  });
     $("#delete_row").click(function(){
         if(i>1){
         $("#addr"+(i-1)).html('');
         i--;
         }
     });

});

JSFiddle demo