7

jQuery/CSS でクロス ブラウザーの問題をデバッグしようとしています。

クラスの境界線の幅を取得しようとしています。クラスは CSS で次のように設定されます。

.mod_button {
    position: relative;
    color: #fff;
    border-color: #06253e;
    border-width: 1px;
    border-style: solid;
}

jQueryでは、次のようにボーダー幅を取得しようとしています:

var bWidth = $('.mod_button').css('border-width');

これは Chrome では「1px」の文字列として正しく返されるようです。ただし、Firefox では常に空の文字列 "" として返されます。Chrome と Firefox の両方で開発者ツールの JS デバッガーをステップ実行して、これらの結果を確認しました。

私はこの問題をデバッグしようとして夢中になっており、簡潔な答えが見つからないようです。おそらく、ここのコミュニティが、この問題を解決する方法についての手がかりを提供してくれるでしょう。

ありがとうございました！

4

1 に答える 1

18

「border」、「background」、さらには「border-width」などのプロパティは省略形です。それらはサポートされていません。代わりに、より具体的なプロパティ「border-top-width」、「border-bottom-width」を使用してください。

次の行は、すべてのブラウザーで機能するはずです。

var bWidth = $('.mod-button').css('border-top-width');

関連する質問: Firefox 14.0.1 で jQuery を使用して CSS ボーダー値を取得する

于 2013-06-18T18:21:01.663 に答える