Những thay đổi trong cách Drupal 7 xử lý JavaScript và jQuery

14

Tôi hiện đang phát triển một tập lệnh JavaScript chạy trên trang quản trị. Tôi đã đọc về những thay đổi được thực hiện trong Drupal 7, cụ thể là việc chuyển từ document.ready()chức năng jQuery của chính nó. Tuy nhiên, đoạn script sau không hoạt động.

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

console.log()đang bắn và tôi có thể thấy đầu ra, nhưng phần bổ sung đơn giản không hoạt động. ID trường là chính xác.
Tôi không chắc chắn những gì tôi thiếu ở đây, nhưng tôi nghi ngờ nó có liên quan đến cách tôi tham khảo đối tượng. Nhìn vào Lượt xem 3 mã JavaScript, tôi có thể thấy nó được thực hiện theo cách tương tự.

7 javascript

— kỹ thuật số
nguồn

Nếu bạn console.log ($ ('# edit-apiusername')); nó có xuất ra đối tượng không, tức là phần tử được tìm thấy trên trang bởi jQuery?

— phật

Ngay cả với Drupal 6, bạn được cho là sử dụng các hành vi của Drupal, thay vì document.ready. Những gì bạn đang báo cáo không cụ thể đối với Drupal 7.

— kiamlaluno

28

Tôi nghĩ rằng bạn đã hiểu nhầm những thay đổi.

Mã JavaScript phải được gói vào (function ($) { ... })(jQuery);để cho phép sử dụng $như lối tắt jQuery. Điều này là để cho phép jQuery chơi độc đáo với các thư viện khác . Trong chức năng này, bạn vẫn phải đợi DOM được tải nếu bạn muốn thay đổi nó. Đó là những gì gói mã của bạn jQuery.ready(function(){ ... })làm.

Nhưng thay vì sử dụng jQuery.ready(function(){ ... }) , bạn nên sử dụng các hành vi để cho JavaScript của Drupal biết rằng mã của bạn muốn xử lý mọi thứ được thêm ( hoặc xóa ) khỏi DOM.

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

— Pierre Buyle
nguồn

1

Bạn cũng có thể xem xét việc đặt bí danh cho toàn bộ đối tượng jQuery thành một biến khác mà bạn chọn, như trong:

$j = jQuery.noConflict();

Bạn sẽ đặt nó bên ngoài câu lệnh sẵn sàng để nó có thể truy cập được bên ngoài phần đóng gói.

— Artur
nguồn