2

プロパティを設定する.prop()代わりに使用することをお勧めしますが、すべての場合に機能するとは限りません。.attr()disabled.prop()

たとえば、Twitterのブートストラップモーダルウィンドウの場合：http ：//twitter.github.com/bootstrap/javascript.html#modals

「Launchdemomodal」ボタンを押して、コンソールで実行します。

$('#myModal .btn').prop('disabled', true);

その後、ボタンは無効になりません。しかし、実行する場合：

$('#myModal .btn').attr('disabled', true);

その後、それらは正常に無効になります。

なぜそれが起こるのか考えはありますか？

4

1 に答える 1

5

この質問は、.prop（）と.attr（）の間の混乱を浮き彫りにします。.attr（）メソッドはHTML要素の属性を直接操作し、.prop（）は基になるJavaScript要素のJavaScriptプロパティを操作します。

たとえば、$('#myInput').attr('disabled', true)と$('#myInput').prop('disabled', true)は同じ影響を及ぼしますが、実際には2つの非常に異なる方法で動作しています。

$('#myInput').attr('disabled', true)と同等になりますdocument.getElementById('myInput').setAttribute('disabled', 'disabled');

と$('#myInput').prop('disabled', true)同等になりますdocument.getElementById('myInput').disabled = true;

後者の例には、要素に「無効」属性を作成するという追加の影響がありますが、これはdisabled、ブラウザーによってネイティブに処理される入力のプロパティの機能です。

この例の問題は、JavaScriptオブジェクトにネイティブプロパティ$('#myModal .btn')を持たないアンカー要素を操作しようとしていることです。disabledしたがって、設定.disabled = trueは設定以上のことはしていません.foo = 'bar'。ブラウザは、これらの要素の属性をネイティブに追加することはありません。

これが理にかなっていることを願っています。さらに明確にする必要がある場合は、後で編集します。

于 2012-05-04T03:38:12.300 に答える