禁用/启用按钮和链接的最简单方法是什么（jQuery + Bootstrap）

假设您在页面上有这些按钮，例如：

<input type="submit" class="byBtn" disabled="disabled" value="Change"/>
<input type="submit" class="byBtn" disabled="disabled" value="Change"/>
<input type="submit" class="byBtn" disabled="disabled" value="Change"/>
<input type="submit" class="byBtn" disabled="disabled" value="Change"/>
<input type="submit" class="byBtn" disabled="disabled" value="Change"/>
<input type="submit"value="Enable All" onclick="change()"/>

js代码：

function change(){
   var toenable = document.querySelectorAll(".byBtn");        
    for (var k in toenable){
         toenable[k].removeAttribute("disabled");
    }
}

这是一个比较晚的答案，但是我偶然发现了这个问题，同时在寻找一种方法来单击单击后可能禁用boostrap按钮并可能添加一个不错的效果（例如微调器）。我找到了一个很好的库，它确实做到了：

http://msurguy.github.io/ladda-bootstrap/

您只需包括所需的CSS和JS，向按钮添加一些属性，然后使用javascript启用lada。您的按钮焕然一新（请查看演示以了解它的美丽）！

我知道我的答案来晚了，但是IMO这是切换“启用”和“禁用”按钮的最简单方法

function toggleButtonState(button){

  //If button is enabled, -> Disable
  if (button.disabled === false) {
    button.disabled = true;

  //If button is disabled, -> Enable
  } else if (button.disabled === true) {
    button.disabled = false;
  }
}

对于这种行为，我始终使用jQueryUI button小部件，将其用于链接和按钮。

在HTML中定义标签：

<button id="sampleButton">Sample Button</button>
<a id="linkButton" href="yourHttpReferenceHere">Link Button</a>

使用jQuery初始化按钮：

$("#sampleButton").button();
$("#linkButton").button();

使用button小部件方法来禁用/启用它们：

$("#sampleButton").button("enable"); //enable the button
$("#linkButton").button("disable"); //disable the button

这将解决按钮和光标的行为，但是如果您需要更深入地了解并在禁用时更改按钮样式，请覆盖页面CSS样式文件中的以下CSS类。

.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
      background-color:aqua;
      color:black;
 }

但是请记住：那些CSS类（如果已更改）也将更改其他小部件的样式。

我知道我晚会晚了，但要具体回答两个问题：

“我只想禁用特定的clicky-thing，以便：

• 他们停止点击
• 他们看起来很残疾

这有多难？”

他们停止点击

1.对于像<button>或的按钮，<input type="button">您添加属性：disabled。

<button type="submit" disabled>Register</button>
<input type="button" value="Register" disabled>

2.对于链接，任何链接...实际上，任何HTML元素，都可以使用CSS3 指针事件。

.selector { pointer-events:none; }

当今最先进的技术（14/12/5）对浏览器对指针事件的支持非常棒。但是我们通常必须在IE领域中支持旧版浏览器，因此IE10及以下版本不支持指针事件：http : //caniuse.com/pointer-events。因此，使用此处其他人提到的JavaScript解决方案之一可能是旧版浏览器的方法。

有关指针事件的更多信息：

• https://developer.mozilla.org/zh-CN/docs/Web/CSS/pointer-events
• http://wiki.csswg.org/spec/css4-ui#pointer-events

他们看起来很残疾

显然，这是一个CSS答案，因此：

1.对于类似<button>或<input type="button">使用[attribute]选择器的按钮：

button[disabled] { ... }

input[type=button][disabled] { ... }

-

这是一个基本的演示，其中包含我在这里提到的内容：http : //jsfiddle.net/bXm5B/4/

希望这可以帮助。