Html-如何禁用<a href="">?</a>

Question

我创建了一个按钮，可以在点击时打开模态窗口。

<a href="#"  data-toggle="modal" data-target="#myModal" class="signup-button gray-btn pl-pr-36" id="connectBtn"  data-role="disabled">Connect</a>

出于某种原因，data-role="disabled"无效。 我该如何禁用它？

Answer 1

您可以使用CSS来完成此任务：

<style>
    .disabled {
        pointer-events: none;
        cursor: default;
    }
</style>

<a href="somelink.html" class="disabled">Some link</a>

示例： http://jsfiddle.net/7EQJp/

或者您可以使用JavaScript来阻止默认操作：

$('.disabled').click(function(e){
    e.preventDefault();
})

Answer 2

  

我创建了一个按钮......

这是你出错的地方。你没有创建了一个按钮，你已经创建了一个锚元素。如果您使用了button元素，则不会出现此问题：

<button type="button" data-toggle="modal" data-target="#myModal" data-role="disabled">
    Connect
</button>

如果您要继续使用a元素，至少应该将role属性设置为"button"并删除href属性共：

<a role="button" ...>

完成后，您可以介绍a piece of JavaScript which calls event.preventDefault() - 此处event是您的点击事件。

Answer 3

.disabledLink.disabled {pointer-events:none;}

这应该是希望我帮助的！

Answer 4

<script>
    $(document).ready(function(){
        $('#connectBtn').click(function(e){
            e.preventDefault();
        })
    });
</script>

这将阻止默认操作。