jQuery在Drupal平台上不起作用，但在本地运行良好

Question

I have the following jQuery or a carousel which I have pieced together.

The jQuery works fine locally - but when uploaded to a Drupal platform the jQuery no longer works. It will however work when input through the Console.

jQuery:

carousel = (function(){
  // Read necessary elements from the DOM once
  var box = document.querySelector('.carouselbox');
  var next = box.querySelector('.next');
  var prev = box.querySelector('.prev');

  // Define the global counter, the items and the 
  // current item 
  var counter = 0;
  var items = box.querySelectorAll('.content-items li');
  var amount = items.length;
  var current = items[0];

  box.classList.add('active');

  // navigate through the carousel

  function navigate(direction) {

    // hide the old current list item 
    current.classList.remove('current');

    // calculate th new position
    counter = counter + direction;

    // if the previous one was chosen
    // and the counter is less than 0 
    // make the counter the last element,
    // thus looping the carousel
    if (direction === -1 && 
        counter < 0) { 
      counter = amount - 1; 
    }

    // if the next button was clicked and there 
    // is no items element, set the counter 
    // to 0
    if (direction === 1 && 
        !items[counter]) { 
      counter = 0;
    }

    // set new current element 
    // and add CSS class
    current = items[counter];
    current.classList.add('current');
  }

  // add event handlers to buttons
  next.addEventListener('click', function(ev) {
    navigate(1);
  });
  prev.addEventListener('click', function(ev) {
    navigate(-1);
  });

  // show the first element 
  // (when direction is 0 counter doesn't change)
  navigate(0);

})();

Answer 1

从内联中将其删除到自己的js文件-源文件-完美运行