Я включил JQuery1.5 в заголовок страницы JSF. На этой странице есть куча уже закодированных компонентов Primefaces. После того, как я включил Jquery.js в заголовок страницы, некоторые компоненты Primefaces, такие как <p:commandButton>, теряют свою оболочку, а <p:fileUpload> становится похожим на обычный JSP <input type="file"> и полностью теряет свои возможности AJAX.
Есть ли способ безопасно использовать JQuery вместе с простыми лицами (без конфликтов)?
У меня была такая же проблема, как описано в вопросе. Вот почему я придумал следующее решение:
Включите встроенную библиотеку jQuery Primefaces (в настоящее время 1.4.1), поскольку включение собственной библиотеки jQuery приводит к проблемам с форматированием CSS. Добавление атрибута target="head" позволяет указывать тег везде - например. при использовании шаблонов у вас не всегда есть доступ к тегу <head>:
<h:outputScript library="primefaces" name="jquery/jquery.js" target="head" />
Библиотека jQuery Primefaces включена по умолчанию в конфликтном режиме. Это означает, что ярлык $() нельзя использовать. Чтобы решить эту проблему, включите следующую строку в тег <script> или <h:outputScript>:
<h:outputScript target="head">
// Add the $() function
$ = jQuery;
// Now you can use it
$(document).ready(function() {
...
});
</h:outputScript>
Это лучшее решение, которое я смог найти до сих пор, используя простые лица 2.2.1.
Почему бы не использовать пакеты jquery с PrimeFaces?
<h:outputScript library="primefaces" name="jquery/jquery.js" />
PrimeFaces 2.2.1 имеет jQuery 1.4.4, а 3.0 (в разработке) — 1.5.1.
Многие библиотеки JavaScript используют $ в качестве имени функции или переменной, как это делает jQuery. В случае с jQuery $ — это просто псевдоним для jQuery, поэтому все функции доступны без использования $. Ниже приведены некоторые методы:
Напишите jQuery.noConflict(); перед инициализацией jQuery, см. ниже
jQuery.noConflict();
$(document).ready(function(){
// your jQuery code
});
Создайте другой псевдоним вместо jQuery для использования в остальной части скрипта.
var j = jQuery.noConflict();
// Do something with jQuery
j("div p").hide();
Изменить все экземпляры $ : заменить $ на jQuery в блоке кода jQuery.
jQuery(document).ready(function){
jQuery("div p").hide();
})
Полностью переместите jQuery в новое пространство имен в другом объекте.
var dom = {};
dom.query = jQuery.noConflict(true);
// Do something with the new jQuery
dom.query("div p").hide();
Установите область действия $ как локальную, а не глобальную.
// Method 1
jQuery(document).ready(function($){
$("div").hide();
});
// Method 2
(function($) {
/* some code that uses $ */
})(jQuery);
Примечание: у этого пункта есть один недостаток: у вас не будет доступа к методу $() вашей другой библиотеки.
Мое решение - добавить этот код на страницу по умолчанию:
<script type="text/javascript">var $j = jQuery.noConflict(true);</script>
После этого я использую jquery с:
$j
Спасибо,
jQuery имеет режим 'noConflict, который позволяет ему хорошо работать бок о бок с другими библиотеками. Я не использовал компоненты Primefaces, поэтому не знаю наверняка, но если вы включите jQuery в режиме отсутствия конфликтов, ваши проблемы, скорее всего, исчезнут.
Мой опыт:
У меня была такая же проблема, и я никогда не работал с обеими библиотеками jquery. (Я использую jQuery вместо $, но никогда не пробовал jQuery.noConflict()).
Мое решение состояло в том, чтобы использовать только библиотеку в комплекте с простыми лицами, как описано в ответе Cagatays.
чтобы решить конфликт между Primefaces и jQuery, избегайте импорта какого-либо внешнего файла jQuery, поэтому для решения проблемы импортируйте файлы jQuery, расположенные в банке Primefaces.
<h:outputScript library="primefaces" name="jquery/jquery.js" target="head" />
<h:outputScript library="primefaces" name="jquery/jquery-plugins.js" target="head" />
и в вашем коде jQuery замените $ на jQuery.
