Javascript 禁用特定选项卡的按钮

我有两个标签：-

<div class="modal-body">
   <form name="myForm" novalidate="novalidate">
    <ul class="nav nav-tabs">
       <li class="active"><a data-toggle="tab" href="#basicInfo">Info</a></li>
       <li><a data-toggle="tab" href="#view">View Details</a></li>
    </ul>

  <div class="tab-content">
     <div id="basicInfo"  class="tab-pane fade in active modal-table-div">
      .....
     </div>
  <div id="view" class="tab-pane modal-table-div fade">
     .....
     </div>
</div>

.....
.....

以及删除和添加按钮：

<div class="modal-footer">
     <button type="button" class="btn btn-danger">Delete</button>
     <button type="button" class="btn btn-success">Add</button>
</div>

删除
添加

我想要的是当我点击“查看详细信息”选项卡时，删除按钮和添加按钮被禁用，反之亦然。我应该如何实现这一点

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
  var href= $(e.target).attr("href");
  // check href here and do what you want
});

---

并检查所有事件

我将在

链接

中添加一个类

diableButton

，该类将触发禁用功能，请使用下面的代码

这一行

$（This.find（“a”）.hasClass（“diableButton”）

将询问我们的

链接是否有该类


$（'.nav tabs li'）。单击（函数（）{
if（$（this.find（“a”）.hasClass（“diableButton”））{
$（'.modal footer button'）.prop（“已禁用”，true）；
}否则{
$（'.modal footer button'）.prop（“已禁用”，false）；
}
})





.....
.....
删除
添加
您可以使用
.prop（）
方法禁用按钮：

var isViewTab = $('.modal-body li.active a').attr('href') === "#view";
$(".modal-body").find(".btn-danger,.btn-success") // get the modal buttons
                .prop('disabled', isViewTab ) // disabled them
                .toggleClass('disabled', isViewTab); // add a class to style them disbled

我们可以看看您是如何检测单击了哪个选项卡的吗？@shreyagupta如果您选择的是解决方案，请接受答案。这是表达感谢的最好方式！