동적으로 생성 된 페이지 요소 제거

바이올린 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 객체입니다.

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

JQuery와 객체 요소의 선택 일치의 배열로 위장 :이 시도 오류를 Object #<HTMLDivElement has no method fadeOut

출처

2013-10-25 wootscootinboogie

없음; 없습니다 '$ ('. tile') [numClones]'는 DOM 노드 자체이며 jQuery 객체는 아닙니다. – Mathletics

원본 '.tile'도 제거해야합니까? – Mathletics

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/

출처

2013-10-25 20:16:00 jbabey

나는이 동일한 대답을 가지고 내 것은 downvoted 얻었다. 무슨 일 이니? – Mathletics

@Mathletics 확실하지, 나 아니 었어. – wootscootinboogie

@ jbabey : 이것은 내가 찾고 있던 것입니다. 감사. – wootscootinboogie

-1

를 얻을. 색인을 적용하면 귀하의 경우에 HTMLDivElement을 반환합니다. 그러나 jQuery 객체에서이를 마무리한다면, fadeOut을 문제없이 적용 할 수 있어야합니다.

출처

2013-10-25 20:10:11

jQuery를 이중 포장하지 않고도 원하는 항목을 선택할 수있는 방법은 많습니다. – Mathletics

사실,하지만 OP는 그가 왜 오류를 얻었는지 정확히 알고 싶었습니다. 최적의 솔루션이 있지만이 특정 설명을 통해 코드가 왜 실패했는지 더 잘 설명 할 수 있다고 생각했습니다. –

동적으로 생성 된 페이지 요소 제거

답변

관련 문제