Add checkbox dynamically

问题

how to make the checkbox on the table can be checked? I've the code below to add the checkbox dynamically by using a jquery function. The code below succeed to add the checkbox dynamically, but the problem is the checkbox added by the function can't be checked (disabled).

<table id="detail">
  <tr>
    <td><input type="checkbox" id="cb" name="cb[]"></td>
  </tr>
</table>

This is the button to add the row:

<input type="button" id="addRow" value="ADD ROW" />

And this is the jquery function I have:

<script type="text/javascript">
  $(document).ready(function() {
    $("#addRow").click(function() {
      $('#detail tbody>tr:last').clone(true).insertAfter('#detail tbody>tr:last');
    });
  });
</script>

Anyone can help for the code? Thanks... :)

回答1:

Please first correct the javascript function !

  $(document).ready(function() {
    $("#addRow").click(function() {
      $('#detail tbody>tr:last').clone(true).insertAfter('#detail tbody>tr:last');
    });
  });

And your code works for me means the checkbox is checked (only if you tick last checkbox then your code will clone it)

See my jsfiddle or jsfiddle updated

回答2:

Try this

 $(document).ready(function() {
    $("#addRow").click(function() {
      $('#detail tbody tr:last').clone(true).insertAfter('#detail tbody tr:last');
    });
  });

check FIDDLE

回答3:

 $("#addRow").click(function() {
     var row = $('#detail tbody>tr:last').clone(true);

     // Clear last value
     row.find("input:checkbox").attr('checked', false);

     // Change name attr
     row.find("#cb").attr('name', 'newNmae');

     //disabled set as a true
     row.find("input:checkbox").attr('disabled', true);

     row.insertAfter('#detail tbody>tr:last');
});

来源：https://stackoverflow.com/questions/12524799/add-checkbox-dynamically

标签

jquery

dynamic

checkbox