回答編集履歴
5
修正
test
CHANGED
@@ -4,7 +4,7 @@
|
|
4
4
|
|
5
5
|
|
6
6
|
|
7
|
-
はい、可能です。なぜならば、 `$displaySlide` 変数には
|
7
|
+
はい、可能です。なぜならば、 `$displaySlide` 変数には「その変数が宣言されたときに `active` クラスが存在する要素」が入っているからです。
|
8
8
|
|
9
9
|
|
10
10
|
|
4
修正
test
CHANGED
File without changes
|
3
修正
test
CHANGED
@@ -1,79 +1,15 @@
|
|
1
|
-
> $displaySlide.
|
1
|
+
> $displaySlide.removeClass('active'); が行われて、 class="active" を持つものがなくなった後に、 $displaySlide.prev().addClass('active'); を実行することは可能なのですか?
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
はい、実行されています。
|
6
2
|
|
7
3
|
|
8
4
|
|
9
5
|
|
10
6
|
|
11
|
-
|
7
|
+
はい、可能です。なぜならば、 `$displaySlide` 変数には、「その変数が宣言されたときに `active` クラスが存在する要素」が入っているからです。
|
12
8
|
|
13
9
|
|
14
10
|
|
15
|
-
|
11
|
+
> $displaySlide.removeClass('active');は、class="active"を持つものから、class="active"を取り除くものだと認識していますが、この考えが間違っているのでしょうか?
|
16
12
|
|
17
13
|
|
18
14
|
|
19
|
-
|
20
|
-
|
21
|
-
|
22
|
-
|
23
|
-
もし「最初または最後のスライドで前または次のスライドを表示しようとしたとき、最後または最初のスライドを表示したい」のであれば、 `prev`, `next` メソッドが返す jQuery オブジェクトの `length` プロパティが 0 かどうかによって、それぞれのメソッドで前 (もしくは次) の要素を取得したかの判定を行い、どの要素へ `active` クラスを付与するかを変更することで実現出来ます ([動作確認用リンク](https://jsfiddle.net/mfyrg9q1/))。
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
```jQuery
|
28
|
-
|
29
|
-
$(function() {
|
30
|
-
|
31
|
-
$('.index-btn').click(function() {
|
32
|
-
|
33
|
-
$('.active').removeClass('active');
|
34
|
-
|
35
|
-
var clickedIndex = $('.index-btn').index($(this));
|
36
|
-
|
37
|
-
$('.slide').eq(clickedIndex).addClass('active');
|
38
|
-
|
39
|
-
});
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
$('.change-btn').click(function() {
|
44
|
-
|
45
|
-
// 変数$displaySlideを定義してください
|
46
|
-
|
47
|
-
var $displaySlide = $('.active');
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
// 変数$displaySlideからactiveクラスを取り除いてください
|
52
|
-
|
53
|
-
$displaySlide.removeClass('active');
|
54
|
-
|
55
|
-
|
56
|
-
|
57
|
-
// ifとelseを用いて、$displaySlideの前もしくは次の要素に
|
58
|
-
|
59
|
-
// activeクラスをつけてください
|
60
|
-
|
61
|
-
if ($(this).hasClass('next-btn')) {
|
62
|
-
|
63
|
-
const next = $displaySlide.next();
|
64
|
-
|
65
|
-
(next.length ? next : $("li.slide").first()).addClass('active')
|
66
|
-
|
67
|
-
} else {
|
68
|
-
|
69
|
-
const prev = $displaySlide.prev();
|
70
|
-
|
71
|
-
(prev.length ? prev : $("li.slide").last()).addClass('active')
|
72
|
-
|
73
|
-
}
|
74
|
-
|
75
|
-
});
|
76
|
-
|
77
|
-
});
|
78
|
-
|
79
|
-
```
|
15
|
+
いいえ、間違っていません。
|
2
修正
test
CHANGED
@@ -12,7 +12,7 @@
|
|
12
12
|
|
13
13
|
|
14
14
|
|
15
|
-
い
|
15
|
+
はい、間違っています。そのコードは「`$displaySlide` の前に存在する要素へ `active` クラスを追加する」だけです。質問文のコードにおいて、 `active` クラスを取り除く処理は `removeClass` メソッドで行われています。
|
16
16
|
|
17
17
|
|
18
18
|
|
@@ -58,10 +58,6 @@
|
|
58
58
|
|
59
59
|
// activeクラスをつけてください
|
60
60
|
|
61
|
-
|
62
|
-
|
63
|
-
|
64
|
-
|
65
61
|
if ($(this).hasClass('next-btn')) {
|
66
62
|
|
67
63
|
const next = $displaySlide.next();
|
1
修正
test
CHANGED
@@ -58,19 +58,19 @@
|
|
58
58
|
|
59
59
|
// activeクラスをつけてください
|
60
60
|
|
61
|
-
|
62
61
|
|
63
|
-
|
62
|
+
|
63
|
+
|
64
64
|
|
65
65
|
if ($(this).hasClass('next-btn')) {
|
66
66
|
|
67
|
-
|
67
|
+
const next = $displaySlide.next();
|
68
68
|
|
69
69
|
(next.length ? next : $("li.slide").first()).addClass('active')
|
70
70
|
|
71
71
|
} else {
|
72
72
|
|
73
|
-
|
73
|
+
const prev = $displaySlide.prev();
|
74
74
|
|
75
75
|
(prev.length ? prev : $("li.slide").last()).addClass('active')
|
76
76
|
|