如何使用jQuery和jQuery插件与PrimeFaces [英] How to use jQuery and jQuery plugins with PrimeFaces
问题描述
我有一个PrimeFaces网络应用程序。当我手动添加下面的jQuery和插件时，
< script type =text / javascriptsrc =js / jquery -1.7.1.min.js>< / script>
< script type =text / javascriptsrc =js / onebyone / jquery.onebyone.js>< / script>
< script type =text / javascriptsrc =js / onebyone / jquery.touchwipe.min.js>< / script>
< script type =text / javascriptsrc =js / jquery.carouFredSel-5.5.0.js>< / script>
那么PrimeFaces组件会失去它们的功能和一些风格。例如，< p：dialog> 不显示，< p：accordionPanel> 幻灯片，< p：panelGrid> 丢失填充等。
它
PrimeFaces已经附带jQuery捆绑，但是你下载并安装了另一个只与PrimeFaces捆绑jQuery。我敢肯定，如果你已经付出更多的关注和爱，webbrowser的内置JavaScript控制台，你会看到JS错误。如果您通过右键单击查看JSF生成的HTML输出，则在webbrowser中查看源代码，您将看到另一个 jquery.js 文件
< script type =text / javascriptsrc =js / jquery-1.7.1.min.js> ;< / script>
如果你有页面不一定使用PrimeFaces组件，因此它的jQuery不会自动那么您需要通过适当的< h：outputScript> 明确加载其捆绑的jQuery。
< h：outputScript library =primefacesname =jquery / jquery.js/&
请注意，使用< h：outputScript>
另请参阅：
- 添加jQuery到PrimeFaces会导致所有地方的未捕获TypeError
- 如何解决与primefaces jquery的冲突
I've a PrimeFaces web application. When I manually add jQuery and plugins like below,
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/onebyone/jquery.onebyone.js"></script>
<script type="text/javascript" src="js/onebyone/jquery.touchwipe.min.js"></script>
<script type="text/javascript" src="js/jquery.carouFredSel-5.5.0.js"></script>
then PrimeFaces components loose their functionality and some of their styles. For example, <p:dialog> don't show up, <p:accordionPanel> doesn't slide, <p:panelGrid> loses padding, etcetera.
How is this caused and how can I solve it?
PrimeFaces already ships with jQuery bundled, yet you've downloaded and installed another one which would only conflict with PrimeFaces bundled jQuery. I'm sure that if you have paid a bit more attention and love to the webbrowser's builtin JavaScript console, you would have seen JS errors. And, if you checked the JSF-generated HTML output via rightclick, View Source in webbrowser, you would have seen another jquery.js file being included in HTML <head>.
You need to remove the following line:
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
In case you have pages which do not necessarily use PrimeFaces components, and thus its jQuery wouldn't automatically be included, then you'd need to explicitly load its bundled jQuery by a proper <h:outputScript>.
<h:outputScript library="primefaces" name="jquery/jquery.js" />
Note that using <h:outputScript> does not end up in a duplicate script include on pages which actually use PrimeFaces components.
See also:
- Adding jQuery to PrimeFaces results in Uncaught TypeError over all place
- How to solve a conflict with primefaces jquery
这篇关于如何使用jQuery和jQuery插件与PrimeFaces的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
