在当前使用 jQuery 完成时冻结操作

Question

我有链接列表，例如：

<div class="links">
<a href="#" class="link1">link 1</a>
<a href="#" class="link2">link 2</a>
<a href="#" class="link3">link 3</a>
</div>

当你点击某个链接时，它会将一些内容加载到块<div class="content"></div>

ajax请求的内容，所以不能立即生成。

我如何冻结块 .links 内的点击（它们不应该工作），而 ajax 查询未完成？

Answer 1

我使用的 jQuery 插件Block UI。您可以阻止整个页面或仅阻止一个元素。我做这样的事情。

$.ajaxStart({
    $.blockUI({message: 'Please wait...'});
    //this will block any element with the class links
    //$('.links').blockUI({message: 'Please wait...'});
});

$.ajaxStop({
    $.unblockUI();
});

Block UI 有很多演示供您查看，还有很多配置可供您进行。所以你可以让它看起来像你喜欢的样子。它适用于所有浏览器。

Answer 2

尝试切换 css 属性 pointer-events 更多关于其用法的信息 here。