it-swarm-id.com

Perubahan cara Drupal 7 menangani JavaScript dan jQuery

Saat ini saya sedang mengembangkan skrip JavaScript yang berjalan pada halaman administrasi. Saya membaca tentang perubahan yang dilakukan pada Drupal 7, yaitu pindah dari document.ready() ke fungsi jQuery-nya sendiri. Namun, skrip berikut tidak berfungsi.

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

console.log() menyala dan saya bisa melihat hasilnya, tetapi append sederhana tidak berfungsi. ID bidang sudah benar.
Saya tidak yakin apa yang saya lewatkan di sini, tetapi saya menduga itu ada hubungannya dengan cara saya merujuk objek. Melihat kode JavaScript Views 3, saya bisa melihatnya dilakukan dengan cara yang sama.

14
digital

Saya pikir Anda salah memahami perubahan.

Kode JavaScript harus dibungkus dengan (function ($) { ... })(jQuery); Untuk memungkinkan penggunaan $ Sebagai pintasan ke jQuery. Ini untuk mengizinkan jQuery bermain dengan baik dengan perpustakaan lain . Dalam fungsi ini, Anda masih harus menunggu DOM dimuat jika Anda ingin mengubahnya. Itulah yang membungkus kode Anda di jQuery.ready(function(){ ... }) tidak.

Tetapi alih-alih menggunakan jQuery.ready(function(){ ... }), Anda harus menggunakan perilak untuk membiarkan JavaScript Drupal tahu bahwa kode Anda ingin memproses apa pun yang ditambahkan ( atau dihapus ) dari DOM .

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

Anda juga dapat mempertimbangkan aliasing seluruh objek jQuery ke variabel lain pilihan Anda, seperti pada:

$j = jQuery.noConflict();

Anda akan menempatkan ini di luar pernyataan siap untuk membuatnya dapat diakses di luar enkapsulasi.

1
Artur