マジレス希望

jQuery . プログラミング助けて下さい変数「$displayslide」からactiveク

解決済

質問者：エビフライとたぬき
質問日時：2023/09/08 23:07
回答数：2件

jQuery . プログラミング　助けて下さい

変数「$displayslide」からactiveクラスを
取り除く理由がわかりません。

画像をご確認ください（progateのjQuery講座、上級編です）

「次へ」を押すと次の画像へ、「前へ」を押すと前の画像にいくスライドを作成しています。

4枚の画像があり、番号を押すとその番号の画像に切り替わります。

また、［次へ」［前へ」を押すことで、前後の画像が表示されます。

はじめに、
全画像に「display:none」のcssを使って
非表示にしておきます。

表示したい画像に「display:block」を含んだ「.active」クラスを移動させることで、選んだ画像のみを表示しています。

ここで質問です。

選んだ画像にactiveクラスが移動して、そのactiveクラスを変数$displayslideに代入しています。

displayslideからactiveクラスを取り除いたら、空っぽの変数になるはずなのに、その後のコードで、nextとprevを使って上手にdisplayslideを使える理由がわかりません。

displayslideは、activeクラスを取り除かれたとしても、かつてactiveクラスがあった場所のことを記憶しているのですか？→それ故に「次へ」を押したときに、今表示されている画像、つまりactiveクラスを持っている画像の次の画像にactiveが移動して表示されてくれるのでしょうか？

ちなみに、変数$displayslideからactiveクラスを取り除くコードを消去すると、「次へ」のボタンを押したときに1番目の2番目の画像が両方出ます。3番の画像が表示された状態で「次へ」を押すと、3番と4番の画像が両方表示されてしまいます。

ここでは、4枚目の画像が表示されているときに［次へ」を押すと何も表示されなくなり、1枚目の画像が表示されているときに「前へ」を押しても、同じく何も表示されなくなりますが、ここでは考えないものとしてください。

写真のコードは正しいコードです。

初めて画像付きで質問しましたが、画質が低下しますね、、、
自分でももう一度調べ直してみます。

補足日時：2023/09/08 23:50
通報する

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (2件)

ベストアンサー優先
最新から表示
回答順に表示

No.1ベストアンサー

回答者： fujillin
回答日時：2023/09/09 01:02

こんばんは

＞displayslideからactiveクラスを取り除いたら、空っぽの変数になるはずなのに～
誤解があるようです。
変数 $displaySlide は、その時にactiveクラスを設定されている「要素」になります。
その「要素」から active クラスを削除しても、変数の内容は変わりません。
（削除したので、「activeクラスを設定してあった要素」ということになりますが）
ですので、その「要素」の次、や前の要素はそのまま正しく取得できます。

＞変数$displayslideからactiveクラスを取り除くコードを消去すると、
＞「次へ」のボタンを押したときに1番目の2番目の画像が両方出ます。
次の要素に activeクラスが設定されるので、結果として、「既に設定されていた要素」（＝ $displaySlide ）と次の要素の両方に activeクラスが設定された状態になります。
activeクラスを設定すると表示する仕組みになっているのでしょうから、両方の要素が表示された状態になります。

＞同じく何も表示されなくなりますが、ここでは考えないものとしてください。
1枚目の「前」や4枚目の「後」の要素は存在しないのでしょうから、それだけの処理しかしていなければ、結果的に（削除はされるが）activeクラスを付与された要素は存在しない状態になりますので、何も表示されないということになります。