자바 스크립트가 작동하지 않습니다

Question

drupal 튜토리얼에서이 기능을 발견했습니다. 누군가 나를 설명 할 수, 왜 다음 자바 스크립트 내 워드 프레스 설치 내에서 작동하지 않으며 나에게 해결책을 줄 수 있습니까?

; 
(function ($) { 
"use strict"; 
    var $corn = $('.corn-anchor'); 
    $corn.each(function(idx, el) { 
    var $el = $(el); 
    $el.once('corn-animation', function() { 
     $(window).on('load', function() { 
     new Waypoint({ 
      element: el, 
      handler: function(direction) { 
      $el.toggleClass('corn-animated', (direction == 'down')); 
      }, 
      offset: '85%' 
     }); 
     }); 
    }); 
    }); 
}); 

는 I는 .corn 애니메이션 셀렉터 CSS 전환을 사용하여 그 래퍼 내의 요소 애니메이션 일부 부 - 래퍼를 전환하여 사용하고자. 나는 웨이 포인트 플러그인을 사용하고 있습니다. 심지어 디버거에서 오류 메시지가 표시되지 않지만 클래스 corn-anchor를 사용하여 요소로 스크롤 할 때 toggleClass가 추가되지는 않습니다.

Answer 1

함수에서 코드를 실행하는 것은 없습니다. 그것을보고, 마지막 줄 (

})(jQuery); 
// ^^^^^^^^---- *call* the function, passing in `jQuery` 

되지 또한

}); 

, 그 단지 닫는 </body> 태그 전에 HTML의 끝에 script 태그에 의해로드 된 것 있는지 확인해야 jQuery가 포함 된 script 태그 뒤에). 그렇지 않으면 너무 빨리 실행되어 .corn-anchor 요소를 찾지 못합니다.

스크립트 대신, (당신은 워드 프레스를 사용하고 있기 때문에) 마지막 줄을 변경을 끝 위치를 제어하지 않는 경우, 첫 번째 변경 : 통과, jQuery를 호출

jQuery(function ($) { 

그 기능에서; jQuery는 HTML이 파싱되고 DOM이 채워질 때 함수를 나중에 호출 (첫 번째 인수로 전달)합니다. ready의 별칭입니다.