javascript - 無効な入力に対して警告ラベルが表示されない

Question

私は（まだ）JQueryを使いたくないので、別の解決策を見つけようとしています。有効な検証関数を使用して from を作成しました。ここで、無効な入力時に表示されるラベルを編集する関数を追加したいと考えています。私のcssコードは次のようなものです：

#invalidInputHidden{
    display:none;
    color:#FF0000;
}
.error{
    display:block;
}

そのため、警告テキストは最初は非表示になっています。私の JavaScript では、ラベルにクラスを追加します。これにより、再び表示されるようになります。これを検証関数に入れました：

invalidInputHidden.className += " error";

しかし、これは起こりません。IDがクラスよりも優先されるため、常に「display:none;」が表示されます。?

score 1 · Accepted Answer

「IDがクラスよりも優先されるという事実のためですか」

うん。

「…それで、常にdisplay:none;?」

まあ、いつもではありません。通常の特異性ルールを回避する 1 つの方法は、次を使用すること!importantです。

.error{
    display:block !important;
}

.errorそれは一般的に良い習慣とは見なされません。実際、上記で提供したMDNリンクはそれに対してアドバイスしていますが、個人的には、適用時にクラスが最も重要なスタイルルールになる可能性が高い場合は気にしません。

1 に答える 1