用jQuery写图片删除后恢复图片

下面是一个使用jQuery实现图片删除和恢复的示例代码：

HTML代码：

<div>
  <img src="image1.jpg" />
  <button class="delete">删除</button>
  <button class="restore">恢复</button>
</div>

JavaScript代码：

$(document).ready(function() {
  // 删除按钮点击事件处理程序
  $('button.delete').on('click', function() {
    var img = $(this).prev('img');
    img.data('deleted', true);  // 设置图片的deleted属性为true
    img.fadeOut();  // 淡出图片
  });

  // 恢复按钮点击事件处理程序
  $('button.restore').on('click', function() {
    var img = $(this).prev('img');
    if (img.data('deleted')) {  // 如果图片的deleted属性为true
      img.data('deleted', false);  // 将deleted属性设置为false
      img.fadeIn();  // 淡入图片
    }
  });
});

这段代码首先使用jQuery选择器选择所有的删除和恢复按钮，并为它们添加单击事件处理程序。点击删除按钮时，它会获取相邻的图片元素，并使用jQuery的data()方法将图片的deleted属性设置为true。然后使用jQuery的fadeOut()方法将图片淡出。

当点击恢复按钮时，它会获取相邻的图片元素，并检查它的deleted属性是否为true。如果是，就将该属性设置为false，并使用jQuery的fadeIn()方法将图片淡入。

你可以将这段代码放在一个HTML文件中并在浏览器中打开以看到效果。