0

一部の入力テキスト用に css にクラスがあります。次のように、最初のクラスから拡張するクラスがさらに 2 つあります。

    .input-text-parent {
         background-color: gray;
    }

    .input-text-child-1 {
         extends: input-text-parent;
         background-image: url(images/image1.jpg);
    }

    .input-text-child-2 {
         extends: input-text-parent;
         background-image: url(images/image2.jpg);
    }

ここで、私がやりたいことは、最初のクラス (この場合、input-text-parent) を拡張するすべての要素を jQuery で選択することです。$(".class") を使用すると、そのクラスのすべての要素を取得できることはわかっていますが、すべてのサブクラスを取得する方法がわかりません。

どうもありがとうございました。

私の説明が十分に明確だったことを願っています。

4

3 に答える 3

1

CSS をリファクタリングして、別のクラスを拡張するクラスではなく、複雑な要素に 2 つのクラスを使用することをお勧めします。例えば:

.input-text {
     background-color: gray;
}

.input-text.child-1 {
     background-image: url(images/image1.jpg);
}

.input-text.child-2 {
     background-image: url(images/image2.jpg);
}

次に、次のマークアップを使用できます。

<div class="input-text"></div>
<div class="input-text child-1"></div>
<div class="input-text child-2"></div>

そして、jQuery 経由で次の JavaScript を実行します。

$(".input-text").stuff(); //Select all of them
$(".input-text.child-1").stuff(); //Select only child-1

等。

于 2013-02-25T19:21:07.237 に答える
0

CSS にはサブケースの階層がなく、特定のクラス名で始まるすべての要素を選択することはできません。

でも君ならできる :

特定のクラスを持つすべての要素を選択します。

$('.input-text-parent').each(function(){
    //Do something
});

または、特定のクラスを持つすべての要素を選択します

$('.input-text-parent .input-text-parent-1').each(function(){
    //Do something
});
于 2013-02-25T19:12:45.237 に答える
0

css は実際にはサブクラスをサポートしていないため、jQuery にはこのために特別に組み込まれたものはありません。これらの「サブクラス」のそれぞれは、たまたま似たような名前を持つ完全に別個のクラスです。

filterプロパティと組み合わせたjQueryのメソッドclassNameは、クラスの要素を選択できるはずですinput-text-child-n

$("input").filter(function(){
    return this.className.indexOf("input-text-child-") >= 0;
}).doSomething();
于 2013-02-25T19:13:35.857 に答える