Drupal 7에서 jquery를 사용하는 방법-초보자 용


8

drupal 7에서 jquery를 작동시키는 방법에 대한 많은 자습서를 온라인으로 읽었습니다. 많은 코드와 예제가 있지만 찾을 수없는 것은 어디에 넣을 코드입니다 (아마도 대부분의 개발자에게 명백 할 것입니다)

그래서 내가하는 일은

1) 새로운 커스텀 블록을 만듭니다

2) drupal UI에서 저의 코드를 작성합니다.

(function ($) {

  $(document).ready(function(){

    // jquery here

  });
})(jQuery);

3) 블록을 표시하지만 jquery 가로 드되지 않았습니다.

템플릿 파일, 테마 파일, CSS 파일, 정보 파일 에이 코드를 넣어야한다는 것을 읽었습니다.

정확히 어떤 파일에서 어떤 경로로 위의 코드를 제대로 작동시켜야하는지 명확하지 않습니다.

어떤 충고?

많은 감사합니다!

답변:


11

여기 몇 가지 :

  1. UI를 통해 Javascript와 PHP를 사이트에 입력하지 않으면 줄을 서서히 줄일 수 있습니다. 대안이 없다면 괜찮지 만 여기에 좋은 아이디어가 아닌 몇 가지 이유가 있습니다 : https://drupal.stackexchange.com/a/2512/10729 (js가 아니라 대부분의 PHP를 대상으로한다는 점에 유의하십시오. 포인트는 여전히 js를 나타냅니다). 예제 모듈 지정 블록 생성의 예를 갖는다.
  2. js를 첨부하려면 모든 페이지에서 js를 원하는 경우 테마의 정보 파일에 추가 할 수 있습니다. 그래도 특정 위치에서만 원하는 경우 drupal_add_js () 를 사용하는 것이 가장 좋으 므로 페이지에만 있어야합니다. js 동작을 양식에 첨부하려면 양식 항목에서 #attached 속성을 사용할 수도 있습니다 .
  3. $ (document) .ready ()를 사용하면 페이지가로드 될 때 자바 스크립트가 실행되지만 페이지가 ajax를 통해 업데이트되면 자바 스크립트가 다시 실행되지 않으므로 새로운 마크 업은 자바 스크립트의 영향을받지 않습니다 입니다. 이러한 경우를 처리하려면 문서 준비가 아닌 드 루프 동작 을 사용해야합니다 .

예를 들면 다음과 같습니다.

(function ($) {
  Drupal.behaviors.yourBehaviorName = {
    attach: function (context, settings) {
      // Do your thing here.
    }
  };
})(jQuery);

이 페이지를 읽는 것이 좋습니다.
Drupal 7에서 JavaScript 관리
JavaScript 및 jQuery로 작업


7

.js에서 다음 코드와 같이 삽입 하십시오 .

(function ($) {  

  Drupal.behaviors.themename = {

    attach: function (context, settings) {            

     // All our js code here
     alert('Hello jQuery');
     // end our js code

   }

 };})(jQuery);

테마에서 template.php 만들 hook_preprocess_html 후 사용 drupal_add_js을

function themename_preprocess_html(&$variables) {
  drupal_add_js(drupal_get_path('theme', 'themename') . '/js/your.js', array( 
    'scope' => 'footer', 
    'weight' => '15' 
  ));
}

테마 이름 만 변경 하면됩니다


1
이렇게하면 모든 페이지에 자바 스크립트가 추가되므로 바람직하거나 바람직하지 않을 수 있습니다.
rooby

1
그는 모든 페이지에 자바 스크립트를 추가 할 것입니다. @apdr이 그 지식을 시험해 보도록하세요
sibiru

2
테마를 통해 모든 페이지에 js를로드하려면 테마의 .info 파일에 파일을 나열하는 것이 더 합리적이지 않습니까?
Jimajamma

3

.js 파일은 다음과 같아야합니다.

(function ($) {
    Drupal.behaviors.cdgi = {
        attach: function(context) {

        //your code

        }
    }
}(jQuery));

사용 drupal_add_js ()를 드루팔에서이 파일을 추가 할 모듈. 여기여기에 좋은 참조 .

캐시를 자주 지우십시오.)

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.