带有 jsf 的 jquery

Question

我在将 JQuery 与 JSF 集成时遇到问题。

我使用自旋。我的代码中有：

<script type="text/javascript" src="#{request.contextPath}/scripts/jquery.selectbox-0.5.js"></script>
    jQuery(document).ready(function($){
      $.spin.imageBasePath = '../images/spin1/';
      $('#spin1').spin();
      $('#spin2').spin();
      $('#spin3').spin();
    }

当我第一次调用页面时，“旋转”被添加到组件中。

问题是我也有，一旦我调用它并更新页面的一部分（我有微调器的地方） - 它就不再起作用了。似乎 Jquery 仅在页面读取时被调用，并且一旦刷新它的一部分 - 我将不再执行它。

我尝试将h:commandButton 与f:ajax 一起使用，但没有解决问题。

我试图将脚本移动到正在呈现的表单中，但没有帮助

我该如何解决这个问题？

Answer 1

简而言之，您想在 ajax 请求完成后重新执行它吗？

像这样把它移到一个函数中：

jQuery(document).ready(function() {
    jQuery.spin.imageBasePath = '../images/spin1/';
    runSpinners();
});
function runSpinners() {
    jQuery('#spin1').spin();
    jQuery('#spin2').spin();
    jQuery('#spin3').spin();
}

这样您就可以在<p:commandButton> 的oncomplete 属性中重复使用它。

<p:commandButton oncomplete="runSpinners()" />

或者，您也可以使用<p:ajaxStatus> 在完成每个 ajax 调用时执行它，而不管按下的按钮/链接如何：

<p:ajaxStatus oncomplete="runSpinners()" />

Answer 2

随便写

$=jQuery;

完成此操作后，您可以享受使用 $ 符号编写 jQuery 的标准方式...

$(document).ready(function() {
    $.spin.imageBasePath = '../images/spin1/';
    runSpinners();
});
function runSpinners() {
    $('#spin1').spin();
    $('#spin2').spin();
}