質問編集履歴

2

ファイルの追記

2021/10/02 00:17

投稿

anko__
anko__

スコア5

test CHANGED
File without changes
test CHANGED
@@ -130,6 +130,258 @@
130
130
 
131
131
 
132
132
 
133
+ ■追記
134
+
135
+ 上記のスクリプトは一つのhtml内に記載をしております。
136
+
137
+
138
+
139
+ ```html
140
+
141
+ player.html
142
+
143
+
144
+
145
+ <!DOCTYPE html>
146
+
147
+ <html xmlns:th="http://www.thymeleaf.org">
148
+
149
+
150
+
151
+
152
+
153
+ <head>
154
+
155
+ <link rel="stylesheet" href="css/player.css">
156
+
157
+ <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
158
+
159
+ <script th:src="@{/js/jquery-3.6.0.min.js}"></script>
160
+
161
+
162
+
163
+ <meta charset="UTF-8"/>
164
+
165
+ <script>
166
+
167
+
168
+
169
+ var years = [];
170
+
171
+ var leags = ["batp","batc"];
172
+
173
+ var year = 2005;
174
+
175
+ for(i=0;i<2021-year;i++){
176
+
177
+ years[i] = year+i;
178
+
179
+ for(j=0;j<leags.length;j++){
180
+
181
+ var script = document.createElement('script');
182
+
183
+ script.src = "/json/"+leags[j]+years[i] + ".json.js";
184
+
185
+ document.head.appendChild(script); //<head>に生成
186
+
187
+ }
188
+
189
+ }
190
+
191
+
192
+
193
+ </script>
194
+
195
+ </head>
196
+
197
+ <body>
198
+
199
+ <h3>選手一覧</h3>
200
+
201
+
202
+
203
+ <div>
204
+
205
+ <label id="leag">
206
+
207
+ <label><input type="radio" v-model="value" value=batc>セリーグ</label>
208
+
209
+ <label><input type="radio" v-model="value" value=batp>パリーグ</label>
210
+
211
+ </label>
212
+
213
+
214
+
215
+ <form id="selectDate">
216
+
217
+ <select v-model="selected">
218
+
219
+ <option v-for="(year,index) in list" :key="index":value=year>
220
+
221
+ {{ year }}
222
+
223
+ </option>
224
+
225
+ </select>年
226
+
227
+ </form>
228
+
229
+ </div>
230
+
231
+ <button id="showButton" v-on:click="showPlayers()">検索</button>
232
+
233
+
234
+
235
+ <div id="app">
236
+
237
+ <table class="vue_tbl">
238
+
239
+ <thead>
240
+
241
+ <tr id="table_head">
242
+
243
+ <th>項番</th>
244
+
245
+ <th class="player">選手 <span style="font-size: 12px ;width:100%"></span></th>
246
+
247
+ <th>打率 <span style="font-size: 12px"></span></th>
248
+
249
+ </tr>
250
+
251
+ </thead>
252
+
253
+ <tbody>
254
+
255
+ <tr v-for="(item, index) in items">
256
+
257
+ <td>{{ index + 1 }}</td>
258
+
259
+ <td class="strEle">{{ item.player }} {{ item.team }}</td>
260
+
261
+ <td>{{ item.avarage }}</td>
262
+
263
+ </tr>
264
+
265
+ </tbody>
266
+
267
+ </table>
268
+
269
+ </div>
270
+
271
+
272
+
273
+
274
+
275
+ <script>
276
+
277
+ var app = new Vue({
278
+
279
+ el: '#app',
280
+
281
+ data() {
282
+
283
+ return {
284
+
285
+ items:batc2005,
286
+
287
+ batc2005:batc2005
288
+
289
+ }
290
+
291
+ },
292
+
293
+ methods: {
294
+
295
+ isSelect: function (dataList) {
296
+
297
+ this.items = dataList;
298
+
299
+ }
300
+
301
+ }
302
+
303
+ })
304
+
305
+
306
+
307
+ var leag = new Vue({
308
+
309
+ el: '#leag',
310
+
311
+ data: {
312
+
313
+ value: ''
314
+
315
+ }
316
+
317
+ })
318
+
319
+ var vm = new Vue({
320
+
321
+ el: '#selectDate',
322
+
323
+ data: {
324
+
325
+ selected: null,
326
+
327
+ list: [],
328
+
329
+ num:100
330
+
331
+ },
332
+
333
+ created(){
334
+
335
+ const year = new Date().getFullYear()
336
+
337
+ for(let i=0;i<=year-2005;i++){
338
+
339
+ this.list.unshift(year- i)
340
+
341
+ }
342
+
343
+ this.selected=year
344
+
345
+ },
346
+
347
+ })
348
+
349
+
350
+
351
+ var showButton = new Vue({
352
+
353
+ el: '#showButton',
354
+
355
+ methods:{
356
+
357
+ showPlayers:function(){
358
+
359
+ var str = leag.value+vm.selected
360
+
361
+ app.items=app[str];
362
+
363
+ }
364
+
365
+ }
366
+
367
+ });
368
+
369
+
370
+
371
+ </script>
372
+
373
+ </body>
374
+
375
+
376
+
377
+ </html>
378
+
379
+
380
+
381
+ ```
382
+
383
+
384
+
133
385
  御教授いただけると幸いです。
134
386
 
135
387
  よろしくお願いいたします。

1

ファイルの追加

2021/10/02 00:17

投稿

anko__
anko__

スコア5

test CHANGED
File without changes
test CHANGED
@@ -110,6 +110,26 @@
110
110
 
111
111
 
112
112
 
113
+ ```batc2005.json.js
114
+
115
+ batc2005= [
116
+
117
+ {"caughtStealing":"7","baseOnBalls":"37","homeRuns":"3","hitByPitch":"5","twoBaseHit":"26","runsScored":"100","onBasePercentage":".387","team":"(ヤ)","totalBases":"245","atBat":"588","hit":"202","stolenBases":"29","threeBaseHit":"4","runBatted":"28","sluggingPercentage":".417","totalPlateAppearance":"649","games":"144","strikeouts":"113","sacrificeFly":"1","sacrificeHit":"18","groundIntoDoublePlay":"5","avarage":".344","intentionalBasesOnBalls":"0","player":"青木 宣親"}
118
+
119
+ ,
120
+
121
+ {"caughtStealing":"5","baseOnBalls":"93","homeRuns":"28","hitByPitch":"1","twoBaseHit":"39","runsScored":"102","onBasePercentage":".430","team":"(中)","totalBases":"304","atBat":"515","hit":"169","stolenBases":"13","threeBaseHit":"6","runBatted":"103","sluggingPercentage":".590","totalPlateAppearance":"612","games":"142","strikeouts":"128","sacrificeFly":"3","sacrificeHit":"0","groundIntoDoublePlay":"8","avarage":".328","intentionalBasesOnBalls":"3","player":"福留 孝介"}
122
+
123
+
124
+
125
+ ];
126
+
127
+
128
+
129
+ ```
130
+
131
+
132
+
113
133
  御教授いただけると幸いです。
114
134
 
115
135
  よろしくお願いいたします。