为什么我的元素没有被使用jQuery.remove删除?

时间:2018-03-20 16:59:19

标签: php jquery html html5

我也试图删除所有孩子的元素。这个元素是一个文件表示类型的东西,所有这些元素都有一个唯一的ID。

这是生成它们的PHP代码:

<a id="custom-my-files-file-<?= $i; ?>" href="<?= $data_url ?>" target="_blank"><div class="custom-my-files-list-file">
    <p class="custom-my-files-list-info custom-my-files-list-info-type"><?= $data_type ?></p>
    <p class="custom-my-files-list-info custom-my-files-list-info-name"><?= $data_name ?></p>
    <a><i class="custom-my-files-list-trash icon-trash" data-element="custom-my-files-file-<?= $i; ?>" data-userid="<?= $myself->ID; ?>" data-fileid="<?= $i; ?>"></i></a>
</div></a>

我试图移除包裹整个事物的元素。以下是我尝试使用的代码:

var the_element = '#' + $(this).data('element');
var elem_object = $(the_element);

if (elem_object.length) {
    elem_object.remove();
    console.log('deleted element:');
}

运行代码并删除元素时没有任何操作。确实出现在控制台中。

编辑:

好的,JavaScript代码在AJAX调用中的成功函数内。 AJAX调用位于函数function do_file_trash_action()中。此函数会添加到如下元素:$('.custom-my-files-list-trash').click(do_file_trash_action);

然后,当我上传文件时,我将该函数添加到最后一个元素:$('.custom-my-files-list-trash').last().click(do_file_trash_action);

我已经验证了所有元素都是通过在函数内部alert('Click');作为测试来获得回调。

最后,函数本身就在:

$(document).ready(function() {

});

我也忘了添加: var the_element = '#' + $(this).data('element'); 在成功函数之外和do_file_trash_action函数内部。在修复连接后将其记录下来,它会打印: #custom-my-files-file-0

1 个答案:

答案 0 :(得分:0)

你不能放一个&#34; a&#34;标记在另一个&#34; a&#34; - &GT; https://www.w3.org/TR/html5/text-level-semantics.html#the-a-element

我试图更换你的包装&#34; a&#34;与div和它的工作 - &gt; https://jsfiddle.net/p6to8e8o/12/

<div id="custom-my-files-file-1" href="#">
  <div class="custom-my-files-list-file">
    <p class="custom-my-files-list-info custom-my-files-list-info-type">$data_type</p>
    <p class="custom-my-files-list-info custom-my-files-list-info-name">$data_name</p>
    <a><i class="custom-my-files-list-trash icon-trash" data-element="custom-my-files-file-1" style="cursor: pointer;" data-fileid="1">TRASH</i></a>
  </div>
</div>

$(document).ready(function() {
  $('.custom-my-files-list-trash').click(do_file_trash_action);
});

function do_file_trash_action() {
  var the_element = '#' + $(this).data('element');
  var elem_object = $(the_element);

  if (elem_object.length) {
    elem_object.remove();
    console.log('deleted element:');
  }
}

您必须更新您的html结构。