Требуется. js Ленивая загрузка и изменение событий? - PullRequest
0 голосов
/ 02 марта 2020

Я пытаюсь найти проблему с обновлением устаревшего кода, и я даже не знаю, как его протестировать.

У меня есть форма с множеством взаимосвязанных частей. В этом случае есть опция для «обновления» и опция для дизайна.

Некоторые обновления включают проекты, а некоторые - нет. Поэтому, когда выбрано «upgrade», оно запускает функцию через событие onChange для селектора обновления, который заполняет селектор дизайна.

Селектор дизайна затем имеет свое собственное событие onChange, которое отображает или скрывает «детали». 'элемент, который показывает значок, представляющий выбранный дизайн. Если дизайн не выбран, элемент должен исчезнуть. По умолчанию всякий раз, когда изменяется выбор «дизайн», значение дизайна устанавливается на пустую строку. Таким образом, всякий раз, когда «обновление» изменяется, и он запускает код onChange, вызывая popDesign, значение для дизайна обнуляется. Однако это не вызывает событие изменения, поэтому после того, как селектор установлен на первый элемент, мы вручную запускаем изменение:

    function initDesign() { // runs on page load
        $('#Design').change(onDesignChange); // attach change event
        $('#Upgrade').change(popDesign); // run pop when upgrade changes
        popDesign(); // initialize starting value
    }

    function popDesign() {
        var o = $('#Design').setOptions(['']), show = false; // setOptions with '' empties selector

        // code retrieves values to populate options

        o.selected(0).trigger('change'); // set to 'empty' 1st val and trigger change
    }

    function onDesignChange() {
        console.log('+++++ in onDesignChange');
        let dVal = $('#Design').val();
        console.log('Design value', dVal);

        // code selects an icon based on the design value

        $('#DesignDetails').showif(dVal != ''); // shows or hides based on boolean
    }

Код по-прежнему отлично работает на устаревшей кодовой странице, но на новой версия .trigger ('change') работает только при первом запуске загрузки страницы и не работает позже, когда изменяется опция обновления. Я могу вызвать функцию там вручную, но больше не могу использовать ссылку «this» в функции изменения, и я пытаюсь не изменять устаревший код больше, чем необходимо.

Одно из обновлений до этого Код заключается в том, что некоторые внешние инструменты позволяют пользователю загружать контент для продукта и предварительно просматривать конечный результат, который я перешел в обязательную оболочку. js с собственной ленивой загрузкой. Одна из проблем этого подхода заключается в том, что слою require. js также необходим доступ к jquery, поэтому он снова загружает jquery - я не уверен, как это повлияет на назначенные события изменения, но другие Кажется, что события изменений все еще запускаются очень хорошо.

Какие вещи я могу или должен искать, чтобы выяснить, почему изменение не вызывает? Есть ли какой-нибудь способ, которым я могу проверить, если функция изменения все еще присоединена? Есть ли какой-то способ, которым я могу выполнить все назначения onChange «после», если требуется. js полностью завершено, если это является причиной?

РЕДАКТИРОВАТЬ:

При большем количестве сниффинга, появляется другое изменение события больше не связаны либо. Так что [предполагая, что ленивая загрузка jquery виновата], может показаться, что мне понадобится код require. js для загрузки его собственного варианта jquery (не уверен, как я это делаю), мне нужно прикрепить изменения запускаются каким-либо образом после запроса require. js load of jquery (также не знаю, как это сделать), или мне нужно как-то убедиться, что require. js не затирает jquery и / или любые назначенные события изменения когда он загружается.

(или если jquery отложенная загрузка снова не является проблемой, мне нужно определить фактическую проблему)

...