Javascript 如何在最近的图像中淡入淡出？

我试着用jQuery编写一个小脚本来Fadein最近的图像，但由于某些原因，这段代码不起作用。谁能帮我学语法吗？谢谢

$( ".delimg" ).click(function() {
  $(this).closest( "img" ).fadeTo( "slow" , 0.5, function() {
      $("input[type='button']").toggle(
         function(){
             $(this).val("Undelete");
       }, 
          function(){
             $(this).val("Delete");
       }
);
  });
});

HTML

---

Fiddle:

img元素不是所单击按钮的直接父元素。您需要使用“最近”来获取包含的div，然后在其中搜索图像。试试这个：

$(".delimg").click(function () {
    $(this).closest(".swiper-slide").find('img').fadeTo("slow", 0.5);
});

另外，请注意，

切换

不能再以您现在的方式使用。它现在只显示/隐藏元素，不在连续单击时运行特定功能

要根据需要更改按钮的文本，可以将函数传递到

val（）

，如下所示：

$(".delimg").click(function () {
    var $button = $(this);
    $button.closest(".swiper-slide").find('img').fadeTo("slow", 0.5, function() {
        $button.val(function(i, value) {
            return value == "Delete" ? "Undelete" : "Delete";
        });
    });
});

---

img元素不是所单击按钮的直接父元素。您需要使用“最近”来获取包含的div，然后在其中搜索图像。试试这个：

$(".delimg").click(function () {
    $(this).closest(".swiper-slide").find('img').fadeTo("slow", 0.5);
});

另外，请注意，

切换

不能再以您现在的方式使用。它现在只显示/隐藏元素，不在连续单击时运行特定功能

要根据需要更改按钮的文本，可以将函数传递到

val（）

，如下所示：

$(".delimg").click(function () {
    var $button = $(this);
    $button.closest(".swiper-slide").find('img').fadeTo("slow", 0.5, function() {
        $button.val(function(i, value) {
            return value == "Delete" ? "Undelete" : "Delete";
        });
    });
});

---

它不是祖先，所以您需要遍历-

$(this).closest( ".swiper-slide" ).find("img").fadeTo( "slow" , 0.5, function() {

---

它不是祖先，所以你需要穿越-

$(this).closest( ".swiper-slide" ).find("img").fadeTo( "slow" , 0.5, function() {

---

由于

img

不是

input

的父项，因此您必须这样做：

 $(this).closest(".swiper-slide").find("img")

---

您必须使用class

swiper slide

获取父div，然后从其中获取

img

由于

img

不是

input

的父项，因此，您必须这样做：

 $(this).closest(".swiper-slide").find("img")

---

您必须使用class

swiper slide

获取父div，然后从其中获取

img

你应该上升一级，然后找到

$(...).parent().find(...);



$( ".delimg" ).click(function() {
  $(this).parent().find( "img" ).fadeTo( "slow" , 0.5, function() {
      $("input[type='button']").toggle(
         function(){
             $(this).val("Undelete");
       }, 
          function(){
             $(this).val("Delete");
       }
);
  });
});

编辑

我错过了

标签

---

使用

.parent（）

$(...).parent().find(...);



$( ".delimg" ).click(function() {
  $(this).parent().find( "img" ).fadeTo( "slow" , 0.5, function() {
      $("input[type='button']").toggle(
         function(){
             $(this).val("Undelete");
       }, 
          function(){
             $(this).val("Delete");
       }
);
  });
});

编辑

我错过了
标签
使用
.parent（）.parent（）
最近的
用于查找最近的父项，并且由于您的图像标记不是
的父项，因此它不会work@Huangism-到目前为止，我还没有发现
查找
和
最近的
之间的新区别，我认为
最近的
起到了
查找
的作用。刚才了解到，
最近的
无法识别中间是否有更多的标记。有关更多信息，请参阅
最近的
用于查找最近的父对象，因为您的图像标记不是
的父对象。delimg
这就是为什么它不会work@Huangism-我没有发现
查找
和
最近的
到现在为止，我还以为
最近的
做的是
查找
。刚才了解到，
最近的
无法识别中间是否有更多标记。有关更多信息，淡入淡出功能正常，但取消删除/删除功能不起作用。正在删除按钮。谢谢，正在工作，但如何设置在取消删除时切换fadein？我尝试使用
fadetoggle
和
toggle。fade
但都不起作用。fade工作正常，但取消删除/删除不起作用。正在删除按钮。谢谢，正在工作，但如何设置在取消删除时切换fadein？我尝试使用
fadetoggle
和
toggle.fade
但两者都不起作用。这不起作用，因为.delimg的父项是标记。如果你想使用parent，你应该使用parent（）.parent（）@lock use，就像Pawet和Ruszkow说的，但是$（this）.parent（）.parent（）.children（'img'）.fadeTo（…）你说得对，我错过了标记。parent（）.parent（）应该有帮助，但是最近的（）和find（）要快得多（快了将近50%），这不起作用，.delimg的父项是标记。如果你想使用parent，你应该使用parent（）.parent（）@lock use，就像Pawet和Ruszkow说的，但是$（this）.parent（）.parent（）.children（'img'）.fadeTo（…）你说得对，我错过了标记。parent（）.parent（）应该有帮助，但是最近的（）和find（）要快得多（快了将近50%）