269

JavaScript/jQueryを使用して<button>、<input>または<a>クラスを持つ要素を無効にすることになると混乱します。.btn.btn-primary

そのために次のスニペットを使用しました。

$('button').addClass('btn-disabled');
$('button').attr('disabled', 'disabled');
$('button').prop('disabled', true);

したがって、要素に を提供するだけでは、視覚的には無効に見えますが、機能は同じままであり、それでもクリック可能であるため、要素にとの設定を$('button').addClass('btn-disabled');追加した理由です。attrprop

誰かがこの同じ問題を期限切れにしましたか? TwitterのBootstrapを使用している間、これは正しい方法ですか?

4

6 に答える 6

89

jeroenk's answerから構築すると、要約は次のとおりです。

$('button').addClass('disabled'); // Disables visually
$('button').prop('disabled', true); // Disables visually + functionally

$('input[type=button]').addClass('disabled'); // Disables visually
$('input[type=button]').prop('disabled', true); // Disables visually + functionally

$('a').addClass('disabled'); // Disables visually
$('a').prop('disabled', true); // Does nothing
$('a').attr('disabled', 'disabled'); // Disables visually

フィドルを見る

于 2013-09-03T12:52:49.763 に答える
31 
<div class="bs-example">
      <button class="btn btn-success btn-lg" type="button">Active</button>
      <button class="btn btn-success disabled" type="button">Disabled</button>
</div>
于 2013-10-24T03:57:42.253 に答える
-1

ボタン/アンカー/リンクを無効にするために属性が追加された場合、ブートストラップはそれにスタイルを追加するだけであり、ユーザーは onclick イベントがまだある間でもクリックできます。したがって、私の簡単な解決策は、無効になっているかどうかを確認し、onclickイベントを削除/追加することです:

if (!('#button').hasAttr('disabled'))
 $('#button').attr('onclick', 'someFunction();');
else
 $('#button').removeattr('onclick');
于 2013-08-19T11:05:24.633 に答える