slideToggle активируется при загрузке страницы

Question

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

Сначала мне удалось вызвать опцию выпадающего списка с URL

// Relinquish control of `$` to previous library
jQuery.noConflict();

// Wrap jQuery code in IIFE
(function($) {
  $(document).ready(function() {
    // Construct URL object using current browser URL
    var url = new URL(document.location);

    // Get query parameters object
    var params = url.searchParams;

    // Get value of paper
    var selector = params.get("chart-selector");

    // Set it as the dropdown value
    $("#chart-selector").val(selector);
  });
})(jQuery);

Однако график рендерится только тогда, когда я выбрал опцию раскрывающегося меню mannualy (mouseenter).

$(document).ready(function() {
  $('#navbarDropdown').mouseenter(function() {
    $('.dropdown-menu').slideToggle(300, "linear");
  });

  $('.dropdown-menu').mouseleave(function() {
    $(this).slideToggle(300, "linear");
  });
});

Как я могу сделать это автоматически, когда опция URL-вызова? Большое спасибо всем вам!

Answer 1

Если я правильно понял, вы хотите вызвать slideToggle в раскрывающемся меню сразу после загрузки страницы и установить значение элемента для параметра селектора диаграммы в URL.

Вы можете простосделайте это в $ (document) .ready, вам не нужна функция события DOM для вызова анимации.

Так что вы можете сделать:

// Wrap jQuery code in IIFE
(function($) {
  $(document).ready(function() {
    // Construct URL object using current browser URL
    var url = new URL(document.location);

    // Get query parameters object
    var params = url.searchParams;

    // Get value of paper
    var selector = params.get("chart-selector");

    // Set it as the dropdown value
    $("#chart-selector").val(selector);

    $('.dropdown-menu').slideToggle(300, "linear");
  });
})(jQuery);