Question

对于我正在做的网站，我有一个功能，用户可以隐藏或删除他的帖子。当用户隐藏或删除他的帖子时，我会更改div的背景颜色（使其看起来像死了）。但是，我还要禁用其中的所有<a></a>和（使其无法点击，以便他们无法再使用它们）。

我如何使用jquery做这样的事情？

这与您在stackoverflow.com上删除自己的帖子时发生的情况非常相似，唯一的问题是我需要禁用所有<a></a>和。单击时s调用jquery函数。这就是我需要禁用它们的原因。

<div class="post user" id="EN001">
    <a href="/user/john">View other posts by John</a>
    <i class="icon-hide hide" data-hash="a4d8e82s8w2d2"></i> Hide your post
    <i class="icon-delete delete" data-hash="a4d8e82s8w2d2"></i> Delete your post
</div>

$('.hide,.delete').live('click', function() {
    // self. I fail here;
});

Answer 1

最简单，最简单的方法是在div上显示半透明叠加层。

演示：http://jsfiddle.net/abhitalks/DGek7/

相关CSS ：

div.post {
    position: relative;
}
div.disabled::before {
    content: '';
    background-color: rgba(128,128,128,0.5);
    position: absolute;
    width: 100%; height: 100%;
}

相关JS ：

$('.hide, .delete').on('click', function() {
   $(this).parent().addClass("disabled");
});

Answer 2

一个非常简单的解决方案是在添加首选样式时禁用指针事件：

CSS：

div.disabled {
   pointer-events: none;
   cursor: default;
   opacity: 0.5;
   background: #dddddd;
}

JS：

$('.hide, .delete').on('click', function() {
   $(this).parent().addClass("disabled");
});

Answer 3

你可以捕获div中的任何点击并阻止它们传播

$("#EN001").click(function (ev) {
  return false; // same as ev.preventDefault() + ev.stopPropagation()
});

或者您可以阻止链接上的默认行为（您必须找到另一种方法来禁用＆＃34; i＆＃34;元素，可能会添加＆＃34;禁用＆＃34;类并检查它在另一个事件处理程序

$("#EN001").on("click","a",function (ev) {
  ev.preventDefault();
});

禁用所有<a> and <i> that are inside a div</i></a>

3 个答案: