質問するログイン新規登録

回答編集履歴

6

switchのcaseを若干修正

2018/02/07 01:34

投稿

miyabi_pudding
miyabi_pudding

スコア9572

answer CHANGED
@@ -38,7 +38,7 @@
38
38
  removeClass = 'pika1 pika2 jito';
39
39
  addClass = 'huwa2';
40
40
  break;
41
- case "jato":
41
+ case "jito":
42
42
  removeClass = 'pika1 pika2 huwa1 huwa2';
43
43
  // addClass = 'jito';
44
44
  break;

5

jitoを追加

2018/02/07 01:34

投稿

miyabi_pudding
miyabi_pudding

スコア9572

answer CHANGED
@@ -14,14 +14,48 @@
14
14
 
15
15
  $('.huwa1').fadeIn(1000).delay(1000).fadeOut(1000);
16
16
  $('.huwa2').delay(3000).fadeIn(1000);
17
+
18
+ $('.jito').fadeIn(1000).delay(1000);
17
19
  });
18
20
 
19
21
 
20
22
  $('input[name=selectterm]').on('change', function() {
21
23
  //var targetClass = $(this).val() == "pika1" ? 'pika2' : 'huwa2';
22
- var removeClass = $(this).val() == "pika1" ? 'huwa1 huwa2' : 'pika1 pika2';
24
+ //var removeClass = $(this).val() == "pika1" ? 'huwa1 huwa2' : 'pika1 pika2';
23
- var addClass = $(this).val() == "pika1" ? 'pika2' : 'huwa2';
25
+ //var addClass = $(this).val() == "pika1" ? 'pika2' : 'huwa2';
26
+
27
+ // 先に追加する、消すクラス文字列を入れる変数を定義
28
+ var removeClass,
29
+ addClass;
30
+
31
+ // switch構文で、条件に合った処理を行う
32
+ switch ($(this).val()) {
33
+ case "pika1":
34
+ removeClass = 'huwa1 huwa2 jito';
35
+ addClass = 'pika2';
36
+ break;
37
+ case "huwa1":
38
+ removeClass = 'pika1 pika2 jito';
39
+ addClass = 'huwa2';
40
+ break;
41
+ case "jato":
42
+ removeClass = 'pika1 pika2 huwa1 huwa2';
43
+ // addClass = 'jito';
44
+ break;
45
+ default:
46
+ break;
47
+ }
48
+
49
+ // 共通の処理、1個目の処理を行う
24
- $('.changeterm').eq(0).removeClass(removeClass).addClass($(this).val());
50
+ $('.changeterm').eq(0).removeClass(removeClass).addClass($(this).val());
51
+ // ここでは、共通の処理、クラスを消す、だけを行う
25
- $('.changeterm').eq(1).removeClass(removeClass).addClass(addClass);
52
+ $('.changeterm').eq(1).removeClass(removeClass);
53
+
54
+ // クラスの追加は、jito以外で行うので、条件式で分ける
55
+ if ($(this).val() != "jito") {
56
+ $('.changeterm').eq(1).addClass(addClass);
57
+ }
58
+
59
+
26
60
  });
27
61
  ```

4

再度ピカふわを一度消すよう修正

2018/02/07 00:50

投稿

miyabi_pudding
miyabi_pudding

スコア9572

answer CHANGED
@@ -7,7 +7,7 @@
7
7
 
8
8
  ```javascript
9
9
  $('.osu').on("click",function(){
10
- $('.pika1,.pika2,.huwa1,.huwa2').hide();
10
+ $('.changeterm').hide();
11
11
 
12
12
  $('.pika1').fadeIn(100).delay(100).fadeOut(100);
13
13
  $('.pika2').delay(300).fadeIn(100);

3

ピカふわを実行した時に一度消すよう修正

2018/02/06 04:15

投稿

miyabi_pudding
miyabi_pudding

スコア9572

answer CHANGED
@@ -7,6 +7,8 @@
7
7
 
8
8
  ```javascript
9
9
  $('.osu').on("click",function(){
10
+ $('.pika1,.pika2,.huwa1,.huwa2').hide();
11
+
10
12
  $('.pika1').fadeIn(100).delay(100).fadeOut(100);
11
13
  $('.pika2').delay(300).fadeIn(100);
12
14
 

2

再度修正

2018/02/06 04:14

投稿

miyabi_pudding
miyabi_pudding

スコア9572

answer CHANGED
@@ -16,10 +16,10 @@
16
16
 
17
17
 
18
18
  $('input[name=selectterm]').on('change', function() {
19
- var targetClass = $(this).val() == "pika1" ? 'pika2' : 'huwa2';
19
+ //var targetClass = $(this).val() == "pika1" ? 'pika2' : 'huwa2';
20
20
  var removeClass = $(this).val() == "pika1" ? 'huwa1 huwa2' : 'pika1 pika2';
21
21
  var addClass = $(this).val() == "pika1" ? 'pika2' : 'huwa2';
22
- $('.' + $(this).val()).removeClass(removeClass).addClass($(this).val());
22
+ $('.changeterm').eq(0).removeClass(removeClass).addClass($(this).val());
23
- $('.' + targetClass).removeClass(removeClass).addClass(addClass);
23
+ $('.changeterm').eq(1).removeClass(removeClass).addClass(addClass);
24
24
  });
25
25
  ```

1

質問者の意図に沿うように修正

2018/02/06 03:34

投稿

miyabi_pudding
miyabi_pudding

スコア9572

answer CHANGED
@@ -16,8 +16,10 @@
16
16
 
17
17
 
18
18
  $('input[name=selectterm]').on('change', function() {
19
+ var targetClass = $(this).val() == "pika1" ? 'pika2' : 'huwa2';
19
- var removeClass = $(this).val() == "pika1" ? 'pika1 huwa1' : 'pika2 huwa2';
20
+ var removeClass = $(this).val() == "pika1" ? 'huwa1 huwa2' : 'pika1 pika2';
21
+ var addClass = $(this).val() == "pika1" ? 'pika2' : 'huwa2';
20
- $('.changeterm').removeClass(removeClass).addClass($(this).val());
22
+ $('.' + $(this).val()).removeClass(removeClass).addClass($(this).val());
21
-
23
+ $('.' + targetClass).removeClass(removeClass).addClass(addClass);
22
24
  });
23
25
  ```