Как разрешить конфликты JQuery между 3 или более зависимыми версиями JQuery, используя .noConflict?

Question

Я нашел много других похожих вопросов, но этот конкретный сценарий несколько уникален для более типичных, к которым применимы предыдущие вопросы.

Мое понимание и обычный подход, который я использую для разрешения конфликтов между 2В этом примере следующие версии JQuery:

<script type="text/javascript" src="../Static/jquery-1.3.2.min.js" ></script>

<script type="text/javascript" src="/Scripts/jquery-ui 1.12.1.custom/jquery.js"></script>
<script type="text/javascript">
    var JQuery_1_12_1 = $.noConflict(true);
    $JQuery_1_12_1(document).ready(function () {

            // Code dependent on JQuery 1.12.1 can safely execute here without 
            // conflicting with version 1.3.2
    });
</script>

<script type="text/javascript">
            // Code executed within this block will use 1.3.2
</script>

В качестве альтернативы я мог бы продублировать подход, реализованный для определения переменной noConflict для 1.12.1 для 1.3.2, и результат был бы таким же.

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

Вот текущая ситуация:

<script type="text/javascript" src="../Static/jquery-1.3.2.min.js" ></script>


<script type="text/javascript" src="/Scripts/jquery-ui-1.12.1.custom/jquery-ui.js"></script>
<script type="text/javascript" src="/Scripts/jquery-ui 1.12.1.custom/jquery.js"></script>
<script type="text/javascript">
    var JQuery_1_12_1 = $.noConflict(true);
    $JQuery_1_12_1(document).ready(function () {

            // Code dependent on JQuery 1.12.1 can safely execute here without 
            // conflicting with version 1.3.2 but do to the lack of the dependent version this code will always break
    });
</script>

<script type="text/javascript">
            // Code executed within this block will use 1.3.2
</script>

Как вы можете заметить, существует взаимозависимость между jquery-ui.js и jquery.js, и из-за этой взаимозависимостиПеременная $ JQuery_1_12_1 не может быть применима к обоим.

В качестве альтернативы, создание separПеременная noConflict для библиотеки jquery-ui.js потребовала бы ее размещения в контексте отдельного тега сценария, который по существу нарушил бы зависимость, и код не будет работать правильно.

Как может эта проблемабыть решенным?

Я также пытался использовать те же версии одной из библиотек JQuery для смягчения конфликтов, но каждая из них обладает уникальным набором функций, которые не пересекаются.Таким образом, для каждого требуемого приложения в коде будет работать только одна версия.

Answer 1

Первый : не использовать несколько версий jQuery.Это раздувает и усложняет вашу страницу.Используйте последнюю версию jQuery и, если у вас есть плагины, которые не работают с этой актуальной версией, обновите их, чтобы они работали (и в идеале отправьте запрос на извлечение в репозиторий плагина, если онесть) или используйте что-то, что активно поддерживается вместо этого.

---

Теперь, если по какой-то причине вы не можете этого сделать:

Любой полуприличный плагин jQuery использует jQuery значение переменной по состоянию на момент загрузки плагина , делая что-то вроде этого:

(function($) {
    // Plugin code
})(jQuery);

Если вы позже загрузите другую версию jQuery, плагин по-прежнему использует более раннюю версию, потому чтоон захватил значение jQuery по состоянию на момент загрузки.

Поэтому загрузите ваши плагины для данной версии jQuery сразу после загрузки этой версии jQuery.

Затем: выполните то же самое для вашего собственный код.

<script src="../Static/jquery-1.3.2.min.js" ></script>
<script src="../plugin/that/needs/version/132.js"></script>
<script src="../your/code/that/needs/version/132.js"></script>
<script type="text/javascript" src="/Scripts/jquery-ui 1.12.1.custom/jquery.js"></script>
<script type="text/javascript" src="/Scripts/jquery-ui-1.12.1.custom/jquery-ui.js"></script>
<script src="../your/code/that/needs/what/jQueryUI/is/using.js"></script>

... где ваш код скрипта делает то же самое, что делает плагин с хорошим поведением:

(function($) {
    // Use $ here
})(jQuery);

Если у вас есть код, который (вздрагивает) нужно использовать оба версии jQuery, захватите каждую версию в переменной:

<script src="../Static/jquery-1.3.2.min.js" ></script>
<script src="../plugin/that/needs/version/132.js"></script>
<script>
var jQuery_v132 = jQuery;
</script>
<script src="../your/code/that/needs/version/132.js"></script>
<script type="text/javascript" src="/Scripts/jquery-ui 1.12.1.custom/jquery.js"></script>
<script type="text/javascript" src="/Scripts/jquery-ui-1.12.1.custom/jquery-ui.js"></script>
<script>
var jQuery_whatever = jQuery;
</script>
<script src="../your/code/that/needs/what/jQueryUI/is/using.js"></script>
<script src="../your/code/using/both.js"></script>

... где ваш код, использующий оба, использует jQuery_v132 или jQuery_whatever в зависимости от ситуации.

(я использовал«что угодно», потому что я понятия не имею, какая версия jQuery у вашего jquery-ui 1.12.1.custom/jquery.js файла, но вряд ли это будет jQuery 1.12.1.)