如何使用 jQuery（或 js）禁用非输入元素？

Question

我试图在请求发生时禁用一堆元素（具有 onClick 和其他自定义事件的 div）。我尝试过：$("selector").children().prop("disabled", true);还带有：$("selector").children().attr("disabled", true);还带有：$("selector").children().attr("disabled", "disabled");这些都不起作用，这意味着即使在禁用后它们仍然保留其功能。为了确认我实际上能够定位我测试的所有所需元素：$("selector").children().css({backgroundColor: "black"});所有元素都变成黑色，因此目标是正确的。我对有关如何禁用元素的任何其他建议持开放态度，基本上这些是不应单击的 div（还有其他感兴趣的事件，而不仅仅是 ），click在请求期间，一旦单击了 div，即为什么我尝试暂时禁用它们，并在收到响应后再次重新启用它们。

Answer 1

该disabled属性仅适用于输入元素，例如<input>和<button>例如。它不适用于某些<div>或<li>样式看起来像按钮或输入（可能是可编辑的 div 内容）。

要禁用不是“真实”输入元素的元素，您可以使用$("selector").children().css({pointerEvents: "none"});它将阻止该元素及其子元素上的所有事件，无论绑定的事件处理程序如何。

恢复：$("selector").children().css({pointerEvents: "initial"});

指针事件文档

---

编辑以解决有关键盘事件的评论：

$("selector").children().prop("tabIndex",-1);将避免使用选项卡导航来访问<input>或<button>。

选项卡索引文档

但由于你的要素是<div>......我真的不认为这是相关的。但请尝试一下，看看该附加代码是否真的有必要，并随时为未来的读者发表评论。;)