jQuery로 새로운 요소를 추가 한 핸들

페이지에 기사 목록이 있습니다. "more"버튼을 클릭하면 AJAX를 통해 더 많은 기사가로드됩니다.jQuery로 새로운 요소를 추가 한 핸들

새로 추가 된 기사를 부드럽게 표시해야합니다.

jQuery.fadeIn() 메소드로 할 수 있습니다.

문제는 - 문제의 jQuery 요소에 새 요소가 추가되었을 때 이러한 이벤트를 처리하는 방법입니다.

서버에서 맞춤 자바 스크립트 메소드를 호출하고 싶지 않습니다. 서버 측은 모든 스타일 지정 기능에 대해 약하게 작동해야합니다.

그래서 코드는 서버 측에서 깨끗해야합니다. jQuery.append() 메소드를 사용하여 코드를 새로 추가해야합니다. 클라이언트 측에서

, 그것은 다음과 같이해야한다 :

$("#articles").elementAdded(function(newElem){ 
    newElem.hide(); 
    newElem.fadeIn(600); 
});

는 "elementAdded는"방법의 종류, 내가 찾고 있어요.

어떻게 만드시겠습니까?

미리 감사드립니다.

출처

2010-11-20 AntonAL

귀하의 질문은 elementAdded 이벤트에 관한 것이므로 dommodified 이벤트 인 IMO라고하는 것이 좋습니다. 이들은 jQuery가 그들을 모방해야한다고 생각하지만 Javascript에는 존재하지 않습니다.

그런 다음 contentappended 이벤트에 바인딩하여 append()와 수정을 캡처 할 수

(function($, undefined) { 
    var _append = $.fn.append; 

    $.fn.append = function(newHtml) { 
     return this.each(function(i, el){ 
      var $el = $(el); 
      _append.call($el, newHtml); 
      $el.trigger('contentappended'); 
     }); 
    }; 
})(jQuery);

:이 이론에서 할 어렵지 않다

$('#articles').bind('contentappended', function() { 
    $(this).hide().fadeIn(600); 
});

출처

2010-11-20 12:21:49 lonesomeday

고마워, 나는 그 생각을 이해했다. – AntonAL

서버가 append를 호출하지 않고 모든 javascript가 클라이언트에서 실행됩니다. 새 요소를 추가하는 지점에서 jQuery.fadeIn()을 호출하면됩니다.

출처

2010-11-20 11:59:36 GolezTrol

예, 당신이 맞아 의미있는, 즉 코드를 JS (추가 articles), XHR을 통해 supmitted 될 것입니다, 나는 server-files에 글을 씁니다. 그리고 나는 그것을 피해야합니다. – AntonAL

jQuery로 새로운 요소를 추가 한 핸들

답변

관련 문제