jquery - jqueryでクラスをターゲットにし、cssプロパティを変更する

Question

私のポートフォリオ設定の方法は、潜在的な雇用主が特定のプログラミング言語、たとえばPHPのみを見たい場合、PHPボックスにチェックマークを付けると、PHPが関係するすべてのサンプルが表示されるようにすることです（CMSからのものである可能性があります。またはPHPをまっすぐに）

これが問題のページです

今はある程度機能していますが、AJAXサンプルだけを表示したい場合は、合計3つではなく、1つしか表示されません。どういうわけかフェードインを変更して！重要なものにすることができれば、これはうまくいくと思います

クラスとしてターゲットにしているので、何らかの理由で.attrと.cssは機能しませんが、不透明度は機能します。display属性に！importantを設定できません。

score 2 · Accepted Answer

divの1つが、「Ajax」ではなく「AJAX」クラスの下にリストされています。それを変更すると、私はそれを修正しました。

score 2 · Accepted Answer

示した例では、Ajaxをクリックしたときに表示される唯一のAjaxサンプルは、「Silverstripe2.4の共有イベントカレンダーモジュール」であるクラス「Ajax」を持つサンプルです。

Ajaxとの文字列一致ではないため、一致しないクラスAJAXを持つ他のajaxサンプルが1つだけあります。

AJAX！= Ajax

したがって、大文字と小文字が区別されるため、jqueryセレクターは機能しません。また、私は3つではなく、2つのサンプルしか見ることができませんか？

編集：また、サンプルチェックを接続するJSでは、使用する方が良い場合があります

$('.samples :checkbox').each(function () {

それよりも

$(':checkbox').each(function () {

jqueryが反復しなければならないスコープを制限するためです。

編集：

一部のサンプルが非表示になっている理由を説明するために、それはあなたの

$（'：checkbox'）。each（...）

仕事中;

チェックコントロールは、何かをクリックするたびに起動し、クリックできるすべてのチェックボックスを処理します。あなたの経験がこのように見えたと想像してみてください：

<div class='samples'>
    <div class='asp'>...</div>
    <div class='php asp'>...</div>
    <div class='php django'>
</div>

ASPチェックボックスをクリックすると、ループして、「OK」と表示されます。ASPが含まれているのでサンプル1を表示し、次にループして、「ASPが含まれているのでサンプル2を表示」と言います。その後、もう一度ループします。サンプル3にはASPが含まれていないため、非表示になります。

次に、次のチェックボックスにループします（PHPと呼ばれる引数のため）。サンプル2から開始し（.eachループのため）、チェックされていないことを確認します。これにより、前に表示されていてもサンプル2が非表示になり、サンプル3でも同じです。

意味がわかりますか？後続の.each反復は、チェックボックスに対して実行された表示をキャンセルします。選択したチェックボックスのIDがHTMLレイアウトの実際のサンプルの前に表示されたとき。

2 に答える 2