teratail
回答率
85.30%
teratail header banner
teratail header banner
質問するログイン新規登録
トップに関する質問jQuaryが動作しません

編集履歴

質問編集履歴

10

修正

2021/02/26 08:27

投稿

mitrasi
mitrasi

スコア49

title CHANGED
File without changes
body CHANGED
@@ -2,8 +2,8 @@
2
2
 
3
3
  jQuaryが実行されません。
4
4
  エディタ上でのエラーが出ているわけではないですが、動作しません。
5
- 以下の該当箇所を取り除くと動作するので、全体的な構文ではなく、以下の箇所のどこかが問題かと思われます。
6
5
 
6
+
7
7
  ご教授よろしくお願いいたします。
8
8
 
9
9
 

9

修正

2021/02/26 08:27

投稿

mitrasi
mitrasi

スコア49

title CHANGED
File without changes
body CHANGED
@@ -1,7 +1,7 @@
1
1
  ### 前提・実現したいこと
2
2
 
3
3
  jQuaryが実行されません。
4
- エラーが出ているわけではないですが、動作しません。
4
+ エディタ上でのエラーが出ているわけではないですが、動作しません。
5
5
  以下の該当箇所を取り除くと動作するので、全体的な構文ではなく、以下の箇所のどこかが問題かと思われます。
6
6
 
7
7
  ご教授よろしくお願いいたします。

8

質問タイトルの修正

2021/02/26 08:26

投稿

mitrasi
mitrasi

スコア49

title CHANGED
@@ -1,1 +1,1 @@
1
- jQuaryが動作しません（エラーメッセージ等はなし）
1
+ jQuaryが動作しません
body CHANGED
File without changes

7

修正

2021/02/26 08:25

投稿

mitrasi
mitrasi

スコア49

title CHANGED
File without changes
body CHANGED
@@ -156,7 +156,7 @@
156
156
  以下のように修正したところ、エラーが発生しました。
157
157
  Uncaught SyntaxError: Invalid left-hand side expression in prefix operation　が表示されました
158
158
 
159
- ```js
159
+ ```html
160
160
  <footer class="page-footer" role="contentinfo">
161
161
  <small class="copyright">COPYRIGHT &copy; <a href="http://www.shiftbrain.co.jp" target="_blank">SHIFTBRAIN Inc.</a></small>
162
162
  </footer>

6

コードの修正

2021/02/26 08:19

投稿

mitrasi
mitrasi

スコア49

title CHANGED
File without changes
body CHANGED
@@ -69,7 +69,47 @@
69
69
  ### 該当のソースコード
70
70
 
71
71
  ```js
72
+
73
+ $(function () {
74
+
75
+ var duration = 300;
76
+
77
+ // buttons1 ----------------------------------------
78
+ // buttons1 1行目
79
+ $('#buttons1 button:nth-child(-n+4)')
80
+ .on('mouseover', function () {
81
+ $(this).stop(true).animate({
82
+ backgroundColor: '#ae5e9b',
83
+ color: '#fff'
84
+ }, duration);
85
+ })
86
+ .on('mouseout', function () {
87
+ $(this).stop(true).animate({
88
+ backgroundColor: '#fff',
89
+ color: '#ebc000'
90
+ }, duration);
91
+ });
92
+ // buttons1 ----------------------------------------
93
+ // buttons1 2行目
94
+ $('#buttons1 button:nth-child(n+5):nth-child(-n+8)')
95
+ .on('mouseover', function () {
96
+ $(this).stop(true).animate({
97
+ borderWidth: '12px',
98
+ color: '#ae5e9b'
99
+ }, duration, 'easeOutSine');
100
+ })
101
+ .on('mouseout', function () {
102
+ $(this).stop(true).animate({
103
+ borderWidth: '0px',
104
+ color: '#ebc000'
105
+ }, duration, 'easeOutSine');
106
+ });
107
+
108
+
109
+ // buttons1 ----------------------------
110
+ -- -- -- -- -- --
111
+ // buttons1 3行目
72
- $('#buttons1 button:nth-child(n+9)')
112
+ $('#buttons1 button:nth-child(n+9)')
73
113
  .on('mouseenter', function () {
74
114
  $(this).find('> span').stop(true).animate({
75
115
  width: '100%'
@@ -80,6 +120,10 @@
80
120
  width: '0%'
81
121
  }, duration, 'easeOutQuad');
82
122
  });
123
+
124
+ });
125
+
126
+
83
127
  ```
84
128
 
85
129
 

5

修正

2021/02/26 08:14

投稿

mitrasi
mitrasi

スコア49

title CHANGED
File without changes
body CHANGED
@@ -108,7 +108,7 @@
108
108
  ◆該当jsをとりのぞいて開発ツールのコンソールエラーを見た結果
109
109
  →main.js:42 Uncaught SyntaxError: Unexpected token '}'　が表示されました
110
110
 
111
- ＃追加情報
111
+ ###追加情報
112
112
  以下のように修正したところ、エラーが発生しました。
113
113
  Uncaught SyntaxError: Invalid left-hand side expression in prefix operation　が表示されました
114
114
 

4

情報の追記

2021/02/26 08:13

投稿

mitrasi
mitrasi

スコア49

title CHANGED
File without changes
body CHANGED
@@ -106,4 +106,18 @@
106
106
  →Uncaught SyntaxError: Invalid left-hand side expression in prefix operation　が表示されました
107
107
 
108
108
  ◆該当jsをとりのぞいて開発ツールのコンソールエラーを見た結果
109
- →main.js:42 Uncaught SyntaxError: Unexpected token '}'　が表示されました
109
+ →main.js:42 Uncaught SyntaxError: Unexpected token '}'　が表示されました
110
+
111
+ ＃追加情報
112
+ 以下のように修正したところ、エラーが発生しました。
113
+ Uncaught SyntaxError: Invalid left-hand side expression in prefix operation　が表示されました
114
+
115
+ ```js
116
+ <footer class="page-footer" role="contentinfo">
117
+ <small class="copyright">COPYRIGHT &copy; <a href="http://www.shiftbrain.co.jp" target="_blank">SHIFTBRAIN Inc.</a></small>
118
+ </footer>
119
+ <script src="./js/vendor/jquery-1.10.2.min.js"></script>
120
+ <script src="./js/vendor/jquery-ui-1.10.3.custom.min.js"></script>
121
+ <script src="./js/main.js"></script>
122
+ </body>
123
+ ```

3

追記

2021/02/26 08:12

投稿

mitrasi
mitrasi

スコア49

title CHANGED
File without changes
body CHANGED
@@ -76,7 +76,7 @@
76
76
  }, duration, 'easeOutQuad');
77
77
  })
78
78
  .on('mouseleave', function () {
79
- $(this).find('> span').stop(true).animte({
79
+ $(this).find('> span').stop(true).animate({
80
80
  width: '0%'
81
81
  }, duration, 'easeOutQuad');
82
82
  });
@@ -94,9 +94,16 @@
94
94
  →やはり特に間違いを認識できません。
95
95
 
96
96
  ③該当箇所のjsをとりのぞく
97
- →正常に動作します。
97
+ →正常に動作します。（のちに再度確認したら動きませんでした????）
98
98
  ### 補足情報（FW/ツールのバージョンなど）
99
99
 
100
100
  OS:Windows
101
101
  エディタ:Brackets
102
- ブラウザ:クローム
102
+ ブラウザ:クローム
103
+
104
+ ### 追加情報
105
+ ◆該当jsを含めて開発ツールのコンソールエラーを見た結果
106
+ →Uncaught SyntaxError: Invalid left-hand side expression in prefix operation　が表示されました
107
+
108
+ ◆該当jsをとりのぞいて開発ツールのコンソールエラーを見た結果
109
+ →main.js:42 Uncaught SyntaxError: Unexpected token '}'　が表示されました

2

コードの修正

2021/02/26 08:05

投稿

mitrasi
mitrasi

スコア49

title CHANGED
File without changes
body CHANGED
@@ -10,7 +10,30 @@
10
10
  ### 該当のソースコード
11
11
 
12
12
  ```HTML
13
+ <!DOCTYPE html>
14
+ <html lang="ja">
15
+
16
+ <head>
17
+ <meta charset="UTF-8">
18
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
19
+ <title>Chapter 04-01 &#xB7; jQuery 最高の教科書</title>
20
+ <link rel="stylesheet" href="./css/normalize.css">
21
+ <link rel="stylesheet" href="./css/main.css">
22
+
23
+ <script src="./js/vendor/jquery-1.10.2.min.js"></script>
24
+ <script src="./js/vendor/jquery-ui-1.10.3.custom.min.js"></script>
25
+ <script src="./js/main.js"></script>
26
+ </head>
27
+
28
+ <body>
29
+
30
+ <header class="page-header" role="banner">
31
+ <h1>Creative jQuery Sample</h1>
32
+ </header>
33
+
34
+ <div class="page-main" role="main">
35
+
13
- <div id="buttons1">
36
+ <div id="buttons1">
14
37
  <h2>BUTTONS1</h2>
15
38
  <div class="inner clearfix">
16
39
  <button>Albatross</button>
@@ -27,6 +50,18 @@
27
50
  <button>Lark<span class="bg"><span>Lark</span></span></button>
28
51
  </div>
29
52
  </div>
53
+
54
+ </div>
55
+
56
+ <footer class="page-footer" role="contentinfo">
57
+ <small class="copyright">COPYRIGHT &copy; <a href="http://www.shiftbrain.co.jp" target="_blank">SHIFTBRAIN Inc.</a></small>
58
+ </footer>
59
+
60
+ </body>
61
+
62
+ </html>
63
+
64
+
30
65
  ```
31
66
 
32
67
 

1

修正

2021/02/26 07:41

投稿

mitrasi
mitrasi

スコア49

title CHANGED
File without changes
body CHANGED
@@ -53,6 +53,7 @@
53
53
 
54
54
  ①差分チェックサイトにて差分の比較
55
55
  →教材データ元では「mouseover」となっているが、テキストでは「mouseenter」となっているためそこで差分は出たがあとは特になし。
56
+ ※比較対象は教材データダウンロードの初期状態です。
56
57
 
57
58
  ②自分の目でも再度チェック
58
59
  →やはり特に間違いを認識できません。