JQuery конфликтует с Primefaces? [дубликат]
этот вопрос уже есть ответ здесь:
Я включил JQuery1.5 в заголовке страницы JSF. На этой странице есть куча компонентов Primefaces, уже закодированных. После того, как я включил Jquery.js
в заголовке страница, некоторые компоненты primefaces, такие как <p:commandButton>
теряет кожу и <p:fileUpload>
становится похожим на обычный JSP <input type="file">
и полностью теряет свои возможности AJAX.
есть ли способ безопасно использовать JQuery вместе с primefaces (без конфликта)?
7 ответов
у меня была та же проблема, что и в вопросе. Вот почему я придумал следующее решение:
включить встроенную библиотеку jQuery primefaces (в настоящее время 1.4.1), поскольку включение собственной библиотеки jQuery приводит к проблемам форматирования CSS. Добавление target="head"
атрибут позволяет указывать тег везде-например, при использовании шаблонов у вас не всегда есть доступ к <head>
tag:
<h:outputScript library="primefaces" name="jquery/jquery.js" target="head" />
библиотека jQuery primefaces включена по умолчанию в режим конфликта. Это означает $()
ярлык не может использоваться. Чтобы преодолеть эту проблему, включите следующую строку в <script>
или <h:outputScript>
tag:
<h:outputScript target="head">
// Add the $() function
$ = jQuery;
// Now you can use it
$(document).ready(function() {
...
});
</h:outputScript>
это лучшее решение, которое я мог бы выкопать до сих пор, используя primefaces 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
в блоке кода jQueryjQuery(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 в режиме noconflict, ваши проблемы, скорее всего, исчезнут.
мой опыт:
у меня была такая же проблема, и я никогда не работал с обеими библиотеками jquery. (Я использую jQuery
вместо $
но никогда не пробовал jQuery.noConflict()
).
моим решением было использовать только lib в комплекте с primefaces, как описано в ответе 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.