Bootstrap-slider loading не работает

Question

Я думаю, что у меня проблема с возможностью выбора элементов DOM, которые являются частью bootstrap-slider. Когда я пытаюсь настроить таргетинг на такие события, как click, ничего не увольняется.

Когда я обновляю страницу, все события срабатывают нормально. Почему это может произойти?

$(document).on("page:change", function() { 
    $(".slider-handle") 
     .on("mousedown", function() { 
      console.log("FOCUSED") 
      $(".active-handle").removeClass("active-handle"); 
      $(this).addClass("active-handle"); 
     }) 
     .on("mouseup", function() { 
      console.log("REMOVED") 
      $(this).removeClass("active-handle"); 
      $(".active-handle").removeClass("active-handle"); 
     }) 
     .on("click", function() { 
      console.log("REMOVED") 
      $(this).removeClass("active-handle"); 
      $(".active-handle").removeClass("active-handle"); 
     }) 

Answer 1

Если элементы не видны при загрузке, jQuery не может назначить обработчики событий. Попробуйте это:

$(document).on("mousedown", ".slider-handle", function() { 

Для повышения производительности, заменить document с любым стойким предком элемента.