it-swarm-ko.tech

Drupal 7은 JavaScript 및 jQuery를 처리하는 방식 변경

현재 관리 페이지에서 실행되는 JavaScript 스크립트를 개발 중입니다. Drupal 7, document.ready()에서 자체 jQuery 함수로 이동 한 변경 사항을 읽었지만 다음 스크립트는 작동하지 않습니다.

(function ($) {
  console.log('hello');
  $('#edit-apiusername').append('test');
})(jQuery);

console.log()이 실행 중이며 출력을 볼 수 있지만 간단한 추가가 작동하지 않습니다. 필드 ID가 정확합니다.
내가 무엇을 놓치고 있는지 잘 모르겠지만 객체를 참조하는 방식과 관련이 있다고 생각합니다. Views 3 JavaScript 코드를 보면 비슷한 방식으로 수행 된 것을 볼 수 있습니다.

14
digital

나는 당신이 변화를 오해했다고 생각합니다.

JavaScript 코드는 (function ($) { ... })(jQuery);로 묶어야 jQuery의 바로 가기로 $를 사용할 수 있습니다. 이것은 jQuery가 다른 라이브러리와 잘 작동하도록 허용합니다. 이 함수에서 DOM을 변경하려면 DOM이로드 될 때까지 기다려야합니다. 그것이 jQuery.ready(function(){ ... })에 코드를 배치하는 것입니다.

그러나 jQuery.ready(function(){ ... })을 사용하는 대신 se behaviors 를 사용하여 Drupal의 JavaScript가 코드에서 DOM에서 추가 된 ( 또는 제거 된 ) 항목을 처리하려고한다는 것을 알려야합니다. .

(function ($) {
  Drupal.behaviors.exampleModule = {
    attach: function(context, settings) {
      $(context).find('#edit-apiusername').append('test');
    }
  }
})(jQuery);
28
Pierre Buyle

다음과 같이 전체 jQuery 객체를 선택한 다른 변수로 별칭을 지정할 수도 있습니다.

$j = jQuery.noConflict();

캡슐화 외부에서 액세스 할 수 있도록 준비된 명령문 외부에 배치하십시오.

1
Artur