Question

查看小提琴here中的行为。

$(document).ready(function () {
            $('.tile').draggable();
            $('.tile').on('dragstart', function () {
                var numClones = $('.tile').length - 1
                if (numClones > 0) {
                    //why can't I use fadeOut or empty here?
                    //make sure we don't remove the clone before it's made
                    $('.tile')[numClones].remove();
                }
                console.log(numClones);
                var clone = $(this).clone();
                clone.appendTo('body');
            });
        });

这允许用户在拖动事件上创建页面元素的克隆。它还删除了以前的克隆。在上面的注释行中，当我尝试使用fadeOut从页面中删除div时，为什么会出现错误？这是一个jQuery对象，对吗？我收到错误Object #<HTMLDivElement has no method fadeOut

Answer 1

jQuery元素的索引访问器（它是get(index)的简写）返回DOM元素。你正在寻找jQuery元素，在这种情况下你应该使用.eq(index)（这个没有简写）。

remove()的唯一原因是it is also a DOM element method。

$('.tile').eq(numClones).fadeOut(function () {
    // make sure the old clones get deleted, not just hidden
    $(this).remove();   
});

http://jsfiddle.net/2rnSk/1/

Answer 2

试试这个：

$($('.tile')[numClones]).fadeOut();

jQuery对象伪装成其选择器匹配的元素数组。当您应用索引时，在您的情况下，您将返回HTMLDivElement。但是如果你把它包装在一个jQuery对象中，你应该可以毫无问题地应用fadeOut。

删除动态创建的页面元素

2 个答案: