如何在 PrimeFaces 中使用 jQuery 和 jQuery 插件 [英] How to use jQuery and jQuery plugins with PrimeFaces
问题描述
我有一个 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>
然后 PrimeFaces 组件失去了它们的功能和它们的一些样式.例如，
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 已经与 jQuery 捆绑在一起，但您已经下载并安装了另一个只会与 PrimeFaces 捆绑的 jQuery 冲突.我敢肯定，如果您对网络浏览器的内置 JavaScript 控制台给予更多关注和喜爱，您就会看到 JS 错误.而且，如果您通过右键单击查看 JSF 生成的 HTML 输出，在 webbrowser 中查看源代码，您会看到另一个 jquery.js 文件包含在 HTML <头>.
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>.
您需要删除以下行:
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
如果您的页面不一定使用 PrimeFaces 组件，因此不会自动包含其 jQuery，那么您需要通过适当的 <h:outputScript> 显式加载其捆绑的 jQuery..
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" />
请注意，在实际使用 PrimeFaces 组件的页面上，使用
Note that using <h:outputScript> does not end up in a duplicate script include on pages which actually use PrimeFaces components.
这篇关于如何在 PrimeFaces 中使用 jQuery 和 jQuery 插件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
