Question

我有这张桌子：

<table class="table table-hover table-responsive">
  <tbody>
     <tr>
         <td>1</td> 
         <td>2</td>
         <td><a href="#">Borrar</a></td>
     </tr>
  </tbody>
</table>

我正在使用bootstrap和JQuery，我想禁用表中的链接。我试过了：

this <tr><td class="disabled"><a href="#">Borrar</td></tr>,
this <tr><td disabled><a href="#">Borrar</td></tr>,
this <tr><td><a href="#" class="disabled">Borrar</td></tr>,
this <tr><td><a href="#" disabled>Borrar</td></tr>

但这不起作用。

PD：禁用JQuery或bootstrap对我有好处，我不想将链接转换为bootstrap中的按钮。

Answer 1

您可以使用jQuery preventDefault()方法

$('.table').on('click','a',function(e){
    e.preventDefault();
    //or
    //return false;
});

如果调用此方法，则不会触发事件的默认操作。

Documentation

Answer 2

您可以通过此

禁用所有链接点击事件

$('a').click(function()
{
     return false;
});

<强> [选项]

或者如果您只想禁用特定链接，则首先为该链接提供ID，例如：

<a href="#" id="lnk">Borrar</a>

并像这样更改JavaScript部分：

$('#lnk').click(function()
{
     return false;
});

Answer 3

我试过这个并为我工作。

<table class="table table-hover table-responsive">
  <tbody>
     <tr>
         <td>1</td> 
         <td>2</td>
         <td><a href="#" class="btn" disabled>Borrar</a></td>
     </tr>
  </tbody>
</table>

感谢您的回答。

如何使用jquery或bootstrap禁用表中的链接

3 个答案: