Cambiamenti nel modo in cui Drupal 7 gestisce JavaScript e jQuery

14

Attualmente sto sviluppando uno script JavaScript che viene eseguito su una pagina di amministrazione. Ho letto le modifiche apportate in Drupal 7, in particolare il passaggio dalla document.ready()propria funzione jQuery. Tuttavia, il seguente script non funziona.

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

console.log()sta sparando e posso vedere l'output, ma la semplice append non funziona. L'ID campo è corretto.
Non sono sicuro di cosa mi manchi qui, ma sospetto che abbia a che fare con il modo in cui mi riferisco all'oggetto. Guardando il codice JavaScript di Views 3, vedo che è fatto in modo simile.

7 javascript

— digitale
fonte

Se console.log ($ ('# edit-apiusername')); produce l'oggetto, ovvero l'elemento trovato nella pagina da jQuery?

— Budda,

Anche con Drupal 6 dovevi usare i comportamenti Drupal, invece di document.ready. Quello che stai segnalando non è specifico per Drupal 7.

— kiamlaluno

28

Penso che tu abbia frainteso i cambiamenti.

Il codice JavaScript deve essere inserito (function ($) { ... })(jQuery);per consentire l'utilizzo di $come collegamento a jQuery. Questo per consentire a jQuery di funzionare correttamente con altre librerie . In questa funzione, devi ancora attendere il caricamento del DOM se vuoi modificarlo. Questo è ciò che fa il wrapping del codice jQuery.ready(function(){ ... }).

Ma invece di usare jQuery.ready(function(){ ... }), dovresti usare comportamenti per far sapere a JavaScript di Drupal che il tuo codice vuole elaborare qualsiasi cosa aggiunta ( o rimossa ) dal DOM.

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

— Pierre Buyle
fonte

1

Puoi anche prendere in considerazione l'alias dell'intero oggetto jQuery su un'altra variabile di tua scelta, come in:

$j = jQuery.noConflict();

Metteresti questo fuori dall'istruzione ready per renderlo accessibile al di fuori dell'incapsulamento.

— Artur
fonte