jQuery 可拖动函数导致 PrimeFaces JSF 页面出错

Question

我在 JSF 中使用 jQuery 来制作拖放功能。可拖动功能独立运行良好，但在 JSF 页面中运行时，它会抛出错误！

代码如下：

function attachClickEvents() { 
    $(".circle").on('click', function(event){ 
        event.stopPropagation(); 
        event.stopImmediatePropagation(); 

        $(".circle").each(function(){ 
            $(this).removeClass("selected"); 
        }); 

        $(this).addClass("selected"); 
        // $(this).draggable({containment:'parent',drag: handleDragStop}); 
        $(this).draggable({containment:$(this).parent().parent().parent()}); 
    });     
}

令人惊讶的是，$(this).addClass("selected"); 作品工作正常，并且该标记的外观发生了变化。

但是下一条语句抛出错误：

Uncaught TypeError: $(...).draggable is not a function

我正在使用 JSF 推荐的包含方式 jQuery:

<h:outputScript library="primefaces" name="jquery/jquery.js" target="head" />
<h:outputScript library="primefaces" name="jquery/jquery-plugins.js" target="head" />

怎么了？

Answer 1

问题是我在我的代码中明确添加了一个 jquery 版本。另一位独立工作的开发人员也包含了另一个版本的 jquery。所有3个都是矛盾的。我删除了 jquery 的显式包含，并包含了 prime faces 提供的那个，它开始工作了。始终确保您没有多次包含不同 versions.Hope 的 jquery 这有助于某些

jQuery 可拖动函数导致 PrimeFaces JSF 页面出错

jQuery draggable function causes error in PrimeFaces JSF page

javascript

jquery

jsf

primefaces