質問編集履歴
4
説明を更新
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
次へ進むボタン（.content_btn）を押下すると、
|
|
2
2
|
steps__list-active が次のliに進み、
|
|
3
3
|
content-activeが次のcontentに進むjQueryを書きたいです。
|
|
4
|
+
contetはデフォルト非表示になっていて、content-activeのみ表示をさせたいです。
|
|
4
5
|
forで回してみようと思いましたが、eqに変数を指定すると動きません。。
|
|
5
6
|
どう直せば動くでしょうか。
|
|
6
7
|
|
3
タイトルを修正
title
CHANGED
|
@@ -1,1 +1,1 @@
|
|
|
1
|
-
次へ進むボタンを押すと、ページ遷移しないで次の要素を表示させたい
|
|
1
|
+
次へ進むボタンを押すと、ページ遷移しないで次の要素を表示させたい
|
body
CHANGED
|
File without changes
|
2
タイトルを修正
title
CHANGED
|
File without changes
|
body
CHANGED
|
File without changes
|
1
タグの間違いを修正
title
CHANGED
|
@@ -1,1 +1,1 @@
|
|
|
1
|
-
次へ進むボタンを押すと、ページ遷移しないで次の要素を表示させたい
|
|
1
|
+
次へ進むボタンを押すと、ページ遷移しないで次の要素を表示させたい【編集中】
|
body
CHANGED
|
@@ -5,7 +5,6 @@
|
|
|
5
5
|
どう直せば動くでしょうか。
|
|
6
6
|
|
|
7
7
|
|
|
8
|
-
|
|
9
8
|
【html】
|
|
10
9
|
<ul class="steps">
|
|
11
10
|
<li class="steps_list steps_list-active">1</li>
|
|
@@ -45,17 +44,6 @@
|
|
|
45
44
|
</p>
|
|
46
45
|
</div>
|
|
47
46
|
|
|
48
|
-
【jQuery】
|
|
49
|
-
$(function() {
|
|
50
|
-
for( var i = 0; i < $('.steps_list').length; i++){
|
|
51
|
-
$('#slideForm_btn_item-next_0' + i).on('click', function(){
|
|
52
|
-
$('.stepNavi_item').eq(i).removeClass('stepNavi_item-active');
|
|
53
|
-
$('.stepNavi_item').eq(i + 1).addClass('stepNavi_item-active’);
|
|
54
|
-
$(.content’’).eq(i).removeClass(‘content—active’);
|
|
55
|
-
$(.content’’).eq(i + 1).addClass(‘content—active’);
|
|
56
|
-
});
|
|
57
|
-
}
|
|
58
|
-
});
|
|
59
47
|
|
|
60
48
|
|
|
61
49
|
【css】
|
|
@@ -72,4 +60,16 @@
|
|
|
72
60
|
}
|
|
73
61
|
.content—active {
|
|
74
62
|
display: block;
|
|
75
|
-
}
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
【jQuery】
|
|
66
|
+
$(function() {
|
|
67
|
+
for( var i = 0; i < $('.steps_list').length; i++){
|
|
68
|
+
$(‘.content_btn0' + i).on('click', function(){
|
|
69
|
+
$('.steps_list').eq(i).removeClass('steps_list-active');
|
|
70
|
+
$(''.steps_list').eq(i + 1).addClass('steps_list-active’);
|
|
71
|
+
$('.content').eq(i).removeClass('content—active');
|
|
72
|
+
$('.content').eq(i + 1).addClass('content—active');
|
|
73
|
+
});
|
|
74
|
+
}
|
|
75
|
+
});
|