HTML JS - 通过 CSS 类禁用点击可能性

Question

你好先生请

1°如何通过 css 类禁用 onclick 的点击行为？

2°我无法在 HTML 元素中使用 ID，因为我无法在代码中插入任何 ID，所以我需要使用类来实现奇迹。

3°在我所有的尝试中，没有一个仍然有效。

如果单击我需要禁用的元素和 CSS 类：

<label class="inner all disabled reserved my_numbers">

 <span class="p5_effect_tooltip_b top">

     <span class="numero">999999<br><small>pending<br>payment</small></span>

     <span class="p5_custom_tooltip_b">Pre-Reserved: Jim</span>

 </span>

</label>

班级： label.inner.all.disabled.reserved.my_numbers

1° 第一次尝试：

jQuery(document).ready(function() {

    $("#inner.all.disabled.reserved").click(function() {

        return false;

    });

});

2° 第二次尝试：

$(document).ready(function() {

    $(".label.inner.all.disabled.reserved").click(function() {

        $("label").off("click");

    });

});

3° 第三次尝试：

$(document).ready(function() {

    $("#inner.all.disabled.reserved").click(function() {

        return false;

    });

});

4°尝试：

$('#inner.all.disabled.reserved.my_numbers').disabled = true

Answer 1

我发现最好使用事件。您可以用来.preventDefault()停止事件操作。例子：$(function() {&nbsp; function preventClick(e) {&nbsp; &nbsp; e.preventDefault();&nbsp; &nbsp; console.log(e.target.nodeName + " Click Prevented");&nbsp; &nbsp; return false;&nbsp; }&nbsp; $("label.inner.all.disabled.reserved").click(preventClick).children().click(preventClick);});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><label class="inner all disabled reserved my_numbers">&nbsp;<span class="p5_effect_tooltip_b top">&nbsp; &nbsp; &nbsp;<span class="numero">999999<br><small>pending<br>payment</small></span>&nbsp; &nbsp; &nbsp;<span class="p5_custom_tooltip_b">Pre-Reserved: Jim</span>&nbsp;</span></label>

Answer 2

我特地注册了，console.log()这样你就可以看到点击只能进行一次。有必要吗？$(".inner.all.disabled.reserved").click(function(){&nbsp; console.log('This message will not show!');}).off('click');.inner.all.disabled.reserved:hover {&nbsp; color: green;}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><label class="inner all disabled reserved my_numbers">&nbsp;<span class="p5_effect_tooltip_b top">&nbsp; &nbsp; &nbsp;<span class="numero">999999<br><small>pending<br>payment</small></span>&nbsp; &nbsp; &nbsp;<span class="p5_custom_tooltip_b">Pre-Reserved: Jim</span>&nbsp;</span></label>