jQuery与Primefaces冲突? [英] JQuery Conflicts with Primefaces?
问题描述
我在JSF页面的标题中包含了JQuery1.5.在该页面中,已经编码了许多Primefaces组件.在页面标题中包含Jquery.js
后,某些<p:commandButton>
失去了外观,<p:fileUpload>
看起来像普通的JSP <input type="file">
并完全失去了其AJAX功能.
I have included JQuery1.5 in the header of a JSF page. In that page there is a bunch of Primefaces components already coded. After I have included the Jquery.js
in the header of the page, some primefaces components like <p:commandButton>
loses their skin and <p:fileUpload>
becomes looking like normal JSP <input type="file">
and losing its AJAX capability entirely.
有没有一种方法可以安全地使用JQuery和Primefaces(无冲突)?
Is there a way to use JQuery safely along with primefaces(without conflict)?
推荐答案
我遇到的问题与问题中描述的相同.这就是为什么我想出以下解决方案的原因:
I had the same problem as described in the question. That's why I came up with the following solution:
包括primefaces内置的jQuery库(当前为1.4.1),因为包括自己的jQuery库会导致CSS格式问题.添加target="head"
属性允许在各处指定标签-例如使用模板时,您并不总是可以访问<head>
标记:
Include the primefaces built-in jQuery library (currently 1.4.1) as including an own jQuery library leads to CSS formatting problems. Adding the target="head"
attribute allows for specifying the tag everywhere - e.g. when using templating you not always have access to the <head>
tag:
<h:outputScript library="primefaces" name="jquery/jquery.js" target="head" />
默认情况下,在冲突模式下会包含primefaces jQuery库.这意味着不能使用$()
快捷方式.要解决此问题,请在<script>
或<h:outputScript>
标记中包含以下行:
The primefaces jQuery library is included by default in conflict mode. That means the $()
shortcut cannot by used. To overcome this issue include the following line in a <script>
or <h:outputScript>
tag:
<h:outputScript target="head">
// Add the $() function
$ = jQuery;
// Now you can use it
$(document).ready(function() {
...
});
</h:outputScript>
这是到目前为止我可以使用素数2.2.1挖掘出的最好的解决方案.
That's the best solution I could dig out so far, using primefaces 2.2.1.
这篇关于jQuery与Primefaces冲突?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!