如何解决与primefaces jquery的冲突

我正在开发一个带有primefaces 5的项目,一个页面使用需要jquery的js文件,但是显示Uncaught TypeError: undefined is not a function ,但当我从更改我的jquery源代码时

     

工作正常,但我失去了许多主要function,如contexMenu

我该如何解决这个冲突?

这是我的javascript文件:

 (function($, $S) { //$ jQuery //$S window.localStorage //Variables Declaration var $board = $('#notesForm\\:board'), //Board where the Posticks are sticked Postick, //Singleton Object containing the Functions to work with the LocalStorage len = 0, //Length of Objects in the LocalStorage currentNotes = '', //Storage the html construction of the posticks o; //Actual Postick data in the localStorage //Manage the Posticks in the Local Storage //Each postick is saved in the localStorage as an Object Postick = { add : function(obj) { obj.id = $S.length; $S.setItem(obj.id, JSON.stringify(obj)); }, retrive : function(id) { return JSON.parse($S.getItem(id)); }, remove : function(id) { $S.removeItem(id); }, removeAll : function() { $S.clear(); } }; //If exist any postick, Create it/them len = $S.length; if (len) { for (var i = 0; i < len; i++) { //Create all posticks saved in localStorage var key = $S.key(i); o = Postick.retrive(key); currentNotes += '
x
'; currentNotes += o.text; currentNotes += '
'; } //Append all the posticks to the board $board.html(currentNotes); } //When the document is ready, make all posticks Draggable $(document).ready(function() { $(".postick").draggable({ cancel : '.editable', "zIndex" : 3000, "stack" : '.postick' }); }); //Remove Postick $('span.delete').live('click', function() { if (confirm('Are you sure you want to delete this Note?')) { var $this = $(this); //data-key is the attribute to know what item delete in the localStorage Postick.remove($this.attr('data-key')); $this.closest('.postick').fadeOut('slow', function() { $(this).remove(); }); } }); //Create postick $('#notesForm\\:btn-addNote') .click( function() { $board .append('
x
'); $(".postick").draggable({ cancel : '.editable' }); }); //Save all the posticks when the user leaves the page window.onbeforeunload = function() { //Clean the localStorage Postick.removeAll(); //Then insert each postick into the LocalStorage //Saving their position on the page, in order to position them when the page is loaded again $('.postick').each(function() { var $this = $(this); Postick.add({ top : parseInt($this.position().top), left : parseInt($this.position().left), text : $this.children('.editable').text() }); }); } })(jQuery, window.localStorage);

PrimeFaces作为一个基于jQuery的JSF组件库已经开箱即用了jQuery(和UI)。 一旦在页面上使用PrimeFaces组件,PrimeFaces就会自行加载它们。 绝对没有必要手动加载其他jQuery文件。 它只会在你经历过的所有颜色上发生冲突。

如果你真的想在一个不一定包含PrimeFaces组件的页面上使用jQuery / UI,因此jQuery / UI不一定会自动包含,那么你需要手动包含PrimeFaces捆绑的jQuery,如下所示:

   

注意:这不会以重复包含的方式结束。 JSF / PrimeFaces能够检测到您已经手动声明了它们,并且不会自动包含另一个。

或者,如果您确实想 PrimeFaces捆绑的jQuery / UI 升级到更新版本,请将这些文件放在以下位置和文件名上:

 WebContent |-- resources | `-- primefaces | `-- jquery | |-- jquery.js <-- newer jQuery version | `-- jquery-plugins.js <-- newer jQuery UI version : 

当在WAR而不是JAR中找到JSF资源时,WAR中的那些资源将比JAR中的资源具有更高的加载优先级。

如果您仍然面临Uncaught TypeError错误,请确保您在Internet中找到的jQuery代码段与PrimeFaces捆绑的jQuery版本兼容。 PrimeFaces 5.0附带jQuery 1.11.0和jQuery UI 1.10.3。 您的代码段似乎是针对jQuery 1.4,并且在jQuery 1.11的路径中已经发生了很多变化。 例如, $.live()在1.7中已弃用,在1.9中已删除。 另请参阅文档 。

我也喜欢你的问题。 确保script声明如下例所示。 不要用$(....)唱歌。 使用jQuery(...) 。 对我来说没关系。

       

多个不同版本的jQuery共存