如何获取单击的动态绑定锚标记的父 div？

Posted 2023-05-07

【中文标题】如何获取单击的动态绑定锚标记的父 div？

【英文标题】：How to get parent div of clicked dynamically bound anchor tag?

【发布时间】：2019-03-16 13:33:02

【问题描述】：

如何获取点击的动态绑定锚标签的父 div？ 我在文件上传按钮单击时将多个图像与多个删除锚标记绑定。如下所示

$('#images').on('change', function(e) 
      var files = e.target.files;
      $.each(files, function(i, file) 
            fileCollection.push(file);
            var reader = new FileReader();
            reader.readAsDataURL(file);
            reader.onload = function(e) 

                var templated = '<div id="imgPreView' + i + '" class="col-md-2">&nbsp;&nbsp;&nbsp;' +
                  '<img class="img-responsive" id="targetImg' + i + '" src="' + e.target.result + '"/> ' +
                  '<div class="caption">' +
                  '<a href="#" onclick="ClearPreview(' + i + ')"><i class="fa fa-trash-o"></i></a>' +
                  '<span id="description"></span>' +
                  '</div>' +
                  '</div>';

                $('#images-to-upload').append(templated);

但是当我想在 ClearPreview() 函数中删除图像时，它会删除正确的索引 div 和图像，但是当我应该上传一些其他图像并尝试删除一些索引 img 但它会删除一些其他 img...

function ClearPreview(i) 
  $('#images' + i).val('');
  $('#imgPreView' + i).remove();

那么如何删除当前锚标签点击的图片和div？

【问题讨论】：

$(this).parent();对您的 ClearPreview() 函数的声明将为您提供具有动态“标题”类的单击元素的父 div

删除时需要更新索引。错误的索引可能会导致问题

$(this).parent().remove(); 将删除您当前选择的父元素。

【参考方案1】：

$(this).parent(); 对您的 ClearPreview() 函数的声明将为您动态提供具有“标题”类的单击元素的父 div

【讨论】：

请问语法是什么？

我认为你只需要给锚标签假设类名，只需按类名调用点击事件，这样它就适用于该类的所有锚点，只需添加上面的代码 $(this).parent ().Id 将为您提供特定 div 的 ID，然后您可以按 ID 删除或清空任何元素