Question

我有一个按钮的功能，在这样的点击事件上调用。一旦点击，在点击按钮的行之后立即插入元素的副本。我需要为新的输入字段创建日期选择器插入行。

<tr class="tr_38">
   <td>Maths [ Math01 ]</td>
   <td>Required</td>
   <td>
        <select style="width: 250px;" name="TeacherID[2318]" id="TeacherID[2318]">
        <option selected="" value="132">Dawn Herus - [ID : 132]</option>
        <option value="246">Margaret Wilson - [ID : 246]</option>
        </select>
   </td>
   <td>
        <input class="date hasDatepicker" id="ExamDate_2318" name="ExamDate[2318]" value="02/28/2017"  type="text">
        <input style="width: 100px;" id="ExamTime_2318" name="ExamTime[2318]" value="8:00" type="text">
   </td>
   <td><input value="+" class="more-38-0 more_button" type="button">
   </td>
  </tr>

Jquery函数：

   `var counter = -1;
    $(document).on ('click','.more_button',function(){
        var courseID='';
        var row_classname =  $(this).closest('tr').prop('class');
        $.each($(this).prop('class').split(' '), function(i, name) {
            if (name.indexOf('more-') > -1) { // or name.indexOf('toaster') === 0
                courseID = name.split('-')[1];
                return false;
            }
        });
          var newrow = $('<tr class="'+row_classname+'"><td>'+$(this).parent().parent().find('td:eq(0)').text()+
          '</td><td>'+$(this).parent().parent().find('td:eq(1)').text()+
          '</td><td>'+$(this).parent().parent().find('td:eq(2)').html()+'</td><td>'+
          $(this).parent().parent().find('td:eq(3)').html()+'</td><td><input type="button" value="+" class="more-'+
          courseID+'-1 more_button"><input type="button" class="remove" value="X">'+
          '</td></tr>');
          var $newrow = $(newrow);
         $newrow.find('td:eq(2)').find('select').       prop('id','TeacherID['+counter+']').prop('name','TeacherID['+counter+']');
          $newrow.find('td:eq(3)').find('input[id^="ExamDate_"]').
      prop('id','ExamDate_'+counter).prop('name','ExamDate['+counter+']');

        $newrow.find('td:eq(3)').find('input[id^="ExamTime_"]').
       prop('id','ExamTime_'+counter).prop('name','ExamTime['+counter+']');
          $(newrow).insertAfter($(this).closest('tr'));


          **var $examdate = $('#ExamDate_'+counter);
          $examdate.datepicker();//this is not working** 

          $(this).hide();
          counter--;
    });`

Fiddle

Answer 1

我已从动态输入的datepicker中删除了该类，并再次将datepicker分配给同一元素。

$('#ExamDate_'+counter).removeClass('hasDatepicker').
        datepicker({ changeMonth: true,changeYear: true});

使动态插入元素的datepicker不起作用

1 个答案: