Question

我有许多链接（A元素）STYLED AS按钮，类＆＃34; btn＆＃34;当单击其中一个时，我希望禁用该特定按钮。这段代码不起作用：

$('.btn').on('click', function(e) {
    $(this).prop('disabled',true);
});

有很多教程可以防止表单提交按钮的默认事件，然后禁用它，但这不是我需要的......

显然，我的$this没有指向正确的对象，或某事=）

-----------更新---------------

抱歉，更新如上。我拥有的元素不是一个按钮，它是一个按钮设置为一个按钮...

Answer 1

不要尝试禁用Anchor标记。尝试改为设置href。

$('.btn').on('click', function(e) {
    e.preventDefault();
    $(this).off("click").attr('href', "javascript: void(0);");
   //add .off() if you don't want to trigger any event associated with this link
});

Answer 2

工作正常。

$('.btn').on('click', function(e) {
  $(this).prop('disabled',true);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <button class='btn'>But1</button>
  <button class='btn'>But2</button>
</div>

Answer 3

您可以使用this指定目标，而不是使用id。

＆＃13;

$('.btn').on('click', function(e) {
        $('#btn2').prop('disabled',true);
    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id="btn1" class="btn">Button</button>
<button id="btn2" class="btn">Button</button>
<button id="btn3" class="btn">Button</button>

＆＃13;

希望有所帮助

Answer 4

$('.btn').on('click', function(e) {
    $(this).attr('disabled', true);
});

查看此帖子：https://stackoverflow.com/a/5876747/5243272

Answer 5

这有效（在chrome中），但也许有一些缺点？

        $('.btn').on('click', function(e) {
            if( $(this).prop('disabled') == true) {
                return false; 
            }

            $(this).prop('disabled',true);

        });

Answer 6

您只需要停止链接中的默认操作。

$('.btn').on('click', function(e) {
    $(this).prop('disabled',true);
    e.preventDefault();
});

Answer 7

$(document).ready(function() {
  $('.btn').on('click', function(e) {
    e.stopPropagation();
    e.preventDefault();
    alert('I have been clicked!');
    $(this).css('pointer-events', 'none').css('cursor', 'default');
  });
});

这可以防止该链接上的任何其他进一步点击。

Answer 8

如果你的Html喜欢这个

<a href="https://www.google.co.in/" target="_blank" class="test">This      is another paragraph.</a>

使用以下代码：

$(".test").one("click", function() {
    var clas = $(this).attr("class");
    setTimeout(function() {
        $("." + clas).removeAttr('href');
    }, 100);
});

如果你的Html喜欢这个

<a href="https://www.google.co.in/" target="_blank" class="test"> <button class="btn">This is another paragraph.</button></a>

使用以下代码：

$(".btn").one("click", function() {
    var clas = $(this).parent().attr("class");
    setTimeout(function() {
        $("." + clas).removeAttr('href');
    }, 100);
});

Answer 9

这对我有用：

$('a').css("pointer-events", "none");

使用jQuery

9 个答案: