javascript - 对 AJAX 链接的点击进行反跳

标签 javascript jquery ajax debouncing

是否可以消除链接的点击?如果用户在 pjax 链接上点击次数过多、速度过快,就会破坏新内容的加载。

$(document).on('click', 'a[data-pjax]', loadNewContent);

var $target = $('main.content section.context'),
$fake = $('main.fake'),
$fakeContext = $('main.fake section.context');

function loadNewContent() {

    event.preventDefault();

    var $this = $(this),
    url = $this.attr('href');

    $fake.addClass('is--loading');

    $.pjax({
        url: url,
        fragment: 'body',
        container: $fakeContext
    });

    $fake.one(transitionEnd, function() {
        $target.html($fake.find('section.context').html());
        $fake.removeClass('is--loading');
        $fake.off(transitionEnd);
    });

}

有什么想法吗?我尝试了这个,但它阻止了 loadNewContent 的触发。 (https://github.com/cowboy/jquery-throttle-debounce)

$(document).on('click', 'a[data-pjax]', $.debounce(1000, true, function() {
    loadNewContent();
}));

最佳答案

像这样的东西会起作用:

var callWaiting = false;
callAjax() {
  if(!callWaiting) {
    callWaiting = true;
    makeHttpCall(url, data, function(response) {callWaiting = false;});
    callWaiting = false;
  }
}

关于javascript - 对 AJAX 链接的点击进行反跳,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42978713/

相关文章:

jquery-selectors - JQuery 每个循环 - 对当前循环的元素执行某些操作

javascript - onclick 功能它仅在第二次单击后才起作用

javascript - 在 Javascript ASP.NET Ajax 回调函数中获取对调用对象的引用?

Javascript 闭包,维护外部对象

javascript - 如果没有从选择框中选择任何值(标题除外),则返回 false

javascript - 点击时结合 jQuery

jquery - 如何使 bootstrap-multiselect 不可见我的默认值?

javascript - 使用 $.each jquery 在 ajax 成功中创建 html 选择选项

javascript - ajax url 选项可以采用一组 url 而不是仅一个

javascript - Node.js - 如何读取/写入更改其前端元数据的 Markdown 文件?