javascript - 完全禁用一个元素，包括在单击操作时调用其他 javascript 函数的链接

Question

<li class=" active">
<input class="check-shopby" type="checkbox" onclick="$(this).next().click()" checked="checked">
    <a class="checked" href="http://mysite/~dev433/products//cooking/cook-tops.html" onclick="$(this).previous().checked = false;" style="cursor: pointer;">
        <img width="150" alt="" src="site/media/wysiwyg/attribute_Sets_images/Fagor-CE9-20-1.jpg">
        <span> Electricity (74) </span>
    </a>
    <a onclick="otherjavascriptfunction" href="/somewhere">link</a>
</li>

好的，这是我在 li 项目中的内容，当我在特定条件下进行时，我希望它(li 项目本身和里面的所有其他可点击项目)完全不可点击，如果可能的话一些不可点击(禁用)签名。

这是我尝试过的，但它替换了我的内容，$("div li a").replaceWith(function() { return $(this).text(); });

Answer 1

您可以添加 clickEventListener，它将在 captureMode 中监听 li 元素

If true, useCapture indicates that the user wishes to initiate capture. After initiating capture, all events of the specified type will be dispatched to the registered listener before being dispatched to any EventTargets beneath it in the DOM tree. Events which are bubbling upward through the tree will not trigger a listener designated to use capture.

var disableClicks = document.getElementsByClassName("disable-inner-clicks");
disableClicks.forEach(function(element){
   element.addEventListener('click', function(e){
      e.preventDefault();
      e.stopPropagation();
   }, true);
});

然后对于您想要禁用点击的任何元素，只需添加 class = disable-inner-clicks

<li class="active disable-inner-clicks">
  ....
</li>

无论里面有什么内容，点击都是禁用的，当你的条件满足时，你只需将类添加到元素