ajax - 延迟复选框组的 JSF AJAX 监听器

Question

我有一个复选框组 (h:selectManyCheckbox)，当复选框被选中或未选中时会触发一个 AJAX 事件。这对于 f:ajax 来说很简单，例如，f:ajax execute="@form"event="click"。

我想增强此功能，使其在每次 点击后不再重新执行。相反，我想要一个空闲延迟，这样如果用户快速连续单击三个框，则只有一个往返而不是三个。

有没有办法让 JSF AJAX 监听器 (f:ajax) 在这样的延迟后触发？

Answer 1

如果您还没有使用 JSF 2.2，您可以使用 JS setTimeout()/clearTimeout()使 onclick 超时并在再次单击时清除之前设置的任何内容。

例如

<h:selectManyCheckbox ... styleClass="delayClick">
    <f:selectItems ... />
    <f:ajax ... />
</h:selectManyCheckbox>

基本上(也有一点jQuery的帮助)

$(".delayClick input").each(function(index, input) {
    var onclick = input.onclick;
    input.onclick = null;

    $(input).on("click", function(event) {
        delay(function() { onclick.call(input, event); }, 1000);
    });
});

var delay = (function() {
    var timer = 0;

    return function(callback, timeout) {
        clearTimeout(timer);
        timer = setTimeout(callback, timeout);
    };
})();

如果您已经在使用 JSF 2.2，请设置 delay <f:ajax> 的属性.

<h:selectManyCheckbox ...>
    <f:selectItems ... />
    <f:ajax ... delay="1000" />
</h:selectManyCheckbox>