实现一个重置按钮来收回 jQuery 中已删除的 DOM 元素

Implement a reset button to take back removed DOM elements in jQuery

本文关键字:jQuery 删除 元素 DOM 一个 按钮 实现      更新时间:2023-09-26

如何实现重置按钮来收回jQuery中已删除的DOM元素?

PHP 数组$items = array('a','b','c','d')

标记

<table id="table">
    <?php for( $i=0; $i < count( $items ); $i++ ){?>
    <tr>
        <td><?php echo $i + 1;?></td> // No
        <td><?php echo $items[$i];?></td>
        <td><input type='button' class='DEL' value='DELETE'></td>
    </tr>
    <?php }?>
</table>
<input type="reset" id="RESET" value="Reset">

.JS

$('body').on('click','#RESET', function() {
    // Code call back from db then show to display
    // example select * from school 
});

但我不确定这是否正确,因为它会到达

a,b,c,a,b,c,d,...
for($i=0; $i<(count($items)); $i++){
?><tr>
    <td><?php echo ($i+1);?></td> // No
    <td>
        <?php echo $items[$i]; ?> // a,b,c,d
    </td>
    <td>
        <input type='button' class='DEL' value='DELETE'> // delete row
    </td>
</tr><?php
}
<input type="reset" id="RESET" value="Reset">

在文档的页脚部分中,将以下代码段放在<script>标记中:

window.a = new Array('a','b','c','d');
$('#RESET').click(function(){
  $('#table').empty();
  $.each(a, function(index, element) {
    $('#table').append('<tr><td>'+(index+1)+'<td>'+element+'</td><td><input type="button" class="DEL" value="DELETE"></td></tr>');
  });
});

更新

斯菲德尔