teratail
回答率
85.47%
質問するログイン新規登録
トップに関する質問jQueryによるAjaxが正常に動かないことについて

編集履歴

質問編集履歴

3

追記

2018/04/14 05:25

投稿

penginer
penginer

スコア32

test CHANGED
File without changes
test CHANGED
@@ -46,6 +46,16 @@
46
46
 
47
47
  ```HTML
48
48
 
49
+ <head>
50
+
51
+ <script type="text/javascript" src="jquery-3.2.0.min.js"></script>
52
+
53
+ <script type="text/javascript" src="validation.js"></script>
54
+
55
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
56
+
57
+ <title></title></head>
58
+
49
59
  <p>
50
60
 
51
61
  <input type="radio" name="a" value="a" id="a"><label for="a">A</label>

2

指導された点に従った修正をしました

2018/04/14 05:25

投稿

penginer
penginer

スコア32

test CHANGED
File without changes
test CHANGED
@@ -38,6 +38,10 @@
38
38
 
39
39
  (エラーメッセージ自体は消えるので配列自体は読み込めているはずです)
40
40
 
41
+ 2018/4/14追記
42
+
43
+ 指導に基づきソースコードを差し替えました。
44
+
41
45
  ### 該当のソースコード
42
46
 
43
47
  ```HTML
@@ -492,92 +496,54 @@
492
496
 
493
497
  ```js
494
498
 
495
- $(function () {
496
-
497
- var b = [];
498
-
499
- $("[name='b[]']:checked").each(function () {
500
-
501
- b.push(this.value);
502
-
503
- });
504
-
505
- $("[name=a]").change(function () {
506
-
507
- $.post("function-b.php", 'json', {
508
-
509
- a: $("[name=a]").val()
510
-
511
- }).done(function (response) {
512
-
513
- $("#a_valid").html(response.error);
514
-
515
- });
516
-
517
- });
518
-
519
- $("[name='b[]']").change(function () {
520
-
521
- $.post("function-b.php", 'json', {
522
-
523
- b: b
524
-
525
- }).done(function (response) {
526
-
527
- $("#b_valid").html(response.error_b);
528
-
529
- });
530
-
531
- });
532
-
533
- $("[name=c]").change(function () {
534
-
535
- $.post("function-b.php", 'json', {
536
-
537
- c: $("[name=c]").val()
538
-
539
- }).done(function (response) {
540
-
541
- $("#c_valid").html(response.error_c);
542
-
543
- });
544
-
545
- });
546
-
547
- $("[name=d]").change(function () {
548
-
549
- $.post("function-b.php", 'json', {
550
-
551
- d: $("[name=d]").val()
552
-
553
- }).done(function (response) {
554
-
555
- $("#d_valid").html(response.error_d);
556
-
557
- });
558
-
559
- });
560
-
561
- $("[name=f]").change(function () {
562
-
563
- $.post("function-b.php", 'json', {
564
-
565
- f: $("[name=f]").val()
566
-
567
- }).done(function (response) {
568
-
569
- $("#f_valid").html(response.error_f);
570
-
571
- });
572
-
573
- });
574
-
575
- /*.fail(function(response){
576
-
577
- });*/
499
+ $("[name=gender_a]").change(
500
+
501
+ $.post("function-att.php",{gender_a:$("[name=gender_a]").val()},
502
+
503
+ function(response){$("#gender_valid").html(response.error_gender);},'json');
504
+
505
+ );
506
+
507
+ $("[name='attribute[]']").change(
508
+
509
+ $.post("function-att.php",{attribute:attribute},function(response){
510
+
511
+ var attribute=[];
512
+
513
+ $("[name='attribute[]']:checked").each(function(){attribute.push(this.value);});
514
+
515
+ $("#att_valid").html(response.error_att);},'json');
516
+
517
+ );
518
+
519
+ $("[name=age10_a]").change(
520
+
521
+ $.post("function-att.php",{age10_a:$("[name=age10_a]").val()},
522
+
523
+ function(response){$("#age10_valid").html(response.error_10);},'json');
524
+
525
+ );
526
+
527
+ $("[name=age1_a]").change(
528
+
529
+ $.post("function-att.php",{age1_a:$("[name=age1_a]").val()},
530
+
531
+ function(response){$("#age1_valid").html(response.error_1);},'json');
532
+
533
+ );
534
+
535
+ $("[name=fond_a]").change(
536
+
537
+ $.post("function-att.php",{fond_a:$("[name=fond_a]").val()},
538
+
539
+ function(response){$("#fond_valid").html(response.error_fond);},'json');
540
+
541
+ );
578
542
 
579
543
  });
580
544
 
545
+ //ajaxメソッドをfunctionでくくっても結果は変わりませんでした
546
+
581
547
  ```
582
548
 
583
549
 

1

修正の対応をしました

2018/04/14 04:07

投稿

penginer
penginer

スコア32

test CHANGED
File without changes
test CHANGED
@@ -34,6 +34,10 @@
34
34
 
35
35
  また、['name=b[]']のチェックボックスの部分において値を入れてもそれが本来出したい配列として出力されません。
36
36
 
37
+ これは、$bにarray("1","2","3")を入れた時に"1X,2X,3X"と表示したいのですがそれができずに空文字列が返される状況です
38
+
39
+ (エラーメッセージ自体は消えるので配列自体は読み込めているはずです)
40
+
37
41
  ### 該当のソースコード
38
42
 
39
43
  ```HTML
@@ -46,15 +50,165 @@
46
50
 
47
51
  <input type="radio" name="a" value="c" id="c"><label for="c">C</label>
48
52
 
49
-
50
-
51
53
  </p>
52
54
 
53
- <!--この下にnameがbのチェックボックス(配列を用いるもの)、nameがcとdのプルダウンメニュー、nameがeのラジオボタンがあり
55
+ <div id="a_valid"></div>
54
-
55
- これら全てにaというクラス属性があります。
56
+
56
-
57
- -->
57
+ <p>
58
+
59
+ <input type="radio" name="a" value="a" id="a"><label for="a">a</label>
60
+
61
+ <input type="radio" name="a" value="b" id="b"><label for="b">b</label>
62
+
63
+ <input type="radio" name="a" value="c" id="c"><label for="c">c</label>
64
+
65
+
66
+
67
+ </p>
68
+
69
+
70
+
71
+
72
+
73
+ <div id="att_valid"></div>
74
+
75
+ <p>
76
+
77
+
78
+
79
+
80
+
81
+ <input type="checkbox" name="b[]" value="0" id="0"><label for="0">0X</label><br><br>
82
+
83
+ <input type="checkbox" name="b[]" value="1" id="1"><label for="1">1X</label><br><br>
84
+
85
+ <input type="checkbox" name="b[]" value="2" id="2"><label for="2">2X</label><br><br>
86
+
87
+ <input type="checkbox" name="b[]" value="3" id="3"><label for="3">3X</label><br><br>
88
+
89
+ <input type="checkbox" name="b[]" value="4" id="4"><label for="4">4X</label><br><br>
90
+
91
+ <input type="checkbox" name="b[]" value="5" id="5"><label for="5">5X</label><br><br>
92
+
93
+ <input type="checkbox" name="b[]" value="6" id="6"><label for="6">6X</label><br><br>
94
+
95
+ <input type="checkbox" name="b[]" value="7" id="7"><label for="7">7X</label><br><br>
96
+
97
+ <input type="checkbox" name="b[]" value="8" id="8"><label for="8">8X</label><br><br>
98
+
99
+ <input type="checkbox" name="b[]" value="9" id="9"><label for="9">9X</label><br><br>
100
+
101
+ <input type="checkbox" name="b[]" value="10" id="10"><label for="10">10X</label><br><br>
102
+
103
+ <input type="checkbox" name="b[]" value="11" id="11"><label for="11">11X</label><br><br>
104
+
105
+ <input type="checkbox" name="b[]" value="12" id="12"><label for="12">12X</label><br><br>
106
+
107
+ <input type="checkbox" name="b[]" value="13" id="13"><label for="13">13X</label><br><br>
108
+
109
+ <input type="checkbox" name="b[]" value="14" id="14"><label for="14">14X</label><br><br>
110
+
111
+ <input type="checkbox" name="b[]" value="15" id="15"><label for="15">15X</label><br><br>
112
+
113
+ <input type="checkbox" name="b[]" value="16" id="16"><label for="16">16X</label><br><br>
114
+
115
+ <input type="checkbox" name="b[]" value="17" id="17"><label for="17">17X</label><br><br>
116
+
117
+ <input type="checkbox" name="b[]" value="18" id="18"><label for="18">18X</label><br><br>
118
+
119
+ <input type="checkbox" name="b[]" value="19" id="19"><label for="19">19X</label><br><br>
120
+
121
+ <input type="checkbox" name="b[]" value="20" id="20"><label for="20">20X</label><br><br>
122
+
123
+ <input type="checkbox" name="b[]" value="21" id="21"><label for="21">21X</label><br><br>
124
+
125
+ <input type="checkbox" name="b[]" value="22" id="22"><label for="22">22X</label><br><br>
126
+
127
+ </p>
128
+
129
+ <br><br>
130
+
131
+ <div id="c_valid"></div>
132
+
133
+ <div id="d_valid"></div>
134
+
135
+
136
+
137
+ <p>
138
+
139
+ <select name="c">
140
+
141
+ <option selected disabled></option>
142
+
143
+ <option value="0">0</option>
144
+
145
+ <option value="1">1</option>
146
+
147
+ <option value="2">2</option>
148
+
149
+ <option value="3">3</option>
150
+
151
+ <option value="4">4</option>
152
+
153
+ <option value="5">5</option>
154
+
155
+ <option value="6">6</option>
156
+
157
+ <option value="7">7</option>
158
+
159
+ <option value="8">8</option>
160
+
161
+ <option value="9">9</option>
162
+
163
+ <option value="10">10</option>
164
+
165
+ </select>
166
+
167
+ <select name="d">
168
+
169
+ <option selected disabled></option>
170
+
171
+ <option value="0">0</option>
172
+
173
+ <option value="1">1</option>
174
+
175
+ <option value="2">2</option>
176
+
177
+ <option value="3">3</option>
178
+
179
+ <option value="4">4</option>
180
+
181
+ <option value="5">5</option>
182
+
183
+ <option value="6">6</option>
184
+
185
+ <option value="7">7</option>
186
+
187
+ <option value="8">8</option>
188
+
189
+ <option value="9">9</option></select></p>
190
+
191
+
192
+
193
+ <div id="f_valid"></div>
194
+
195
+ <p>
196
+
197
+ <input type="radio" name="f" value="0" id="F"><label for="F">F</label><br><br>
198
+
199
+ <input type="radio" name="f" value="1" id="E"><label for="E">E</label><br><br>
200
+
201
+ <input type="radio" name="f" value="2" id="D"><label for="D">D</label><br>
202
+
203
+ <input type="radio" name="f" value="3" id="C"><label for="C">C</label><br><br>
204
+
205
+ <input type="radio" name="f" value="4" id="B"><label for="B">B</label><br><br>
206
+
207
+ <input type="radio" name="f" value="5" id="A"><label for="A">A</label></p>
208
+
209
+ <!--ここまで-->
210
+
211
+ </div><br>
58
212
 
59
213
  ```
60
214
 
@@ -338,61 +492,91 @@
338
492
 
339
493
  ```js
340
494
 
341
- $(function (){
342
-
343
- var b=[];
344
-
345
- $("[name='b[]']:checked").each(function(){
346
-
347
- b.push(this.value);
348
-
349
- });
350
-
351
- var data={a_a:$("[name=a_a]").val(),b:b,c_a:$("[name=c_a]").val(),d_a:$("[name=d_a]").val(),f_a:$("[name=f_a]").val()};
352
-
353
- $("[name=a]").change(function(){$.post("function-b.php",'json',{a_a:$("[name=a_a]").val()}).done
354
-
355
- (function(response){
356
-
357
- $("#a_valid").html(response.error_a);});
358
-
359
- });
360
-
361
- $("[name='b[]']").change(function(){$.post("function-b.php",'json',{b:b}).done
362
-
363
- (function(response){
364
-
365
- $("#b_valid").html(response.error_b);});
366
-
367
- });
368
-
369
- $("[name=c]").change(function(){$.post("function-b.php",'json',{c_a:$("[name=c_a]").val()}).done
370
-
371
- (function(response){
372
-
373
- $("#c_valid").html(response.error_c);});
374
-
375
- });
376
-
377
- $("[name=d]").change(function(){$.post("function-b.php",'json',{d_a:$("[name=d_a]").val()}).done
378
-
379
- (function(response){
380
-
381
- $("#d_valid").html(response.error_d);});
382
-
383
- });
384
-
385
- $("[name=f]").change(function(){$.post("function-b.php",'json',{f_a:$("[name=f_a]").val()}).done
386
-
387
- (function(response){
388
-
389
- $("#f_valid").html(response.error_f);});
390
-
391
- });/*.fail(function(response){
392
-
393
- });*/
394
-
395
- });
495
+ $(function () {
496
+
497
+ var b = [];
498
+
499
+ $("[name='b[]']:checked").each(function () {
500
+
501
+ b.push(this.value);
502
+
503
+ });
504
+
505
+ $("[name=a]").change(function () {
506
+
507
+ $.post("function-b.php", 'json', {
508
+
509
+ a: $("[name=a]").val()
510
+
511
+ }).done(function (response) {
512
+
513
+ $("#a_valid").html(response.error);
514
+
515
+ });
516
+
517
+ });
518
+
519
+ $("[name='b[]']").change(function () {
520
+
521
+ $.post("function-b.php", 'json', {
522
+
523
+ b: b
524
+
525
+ }).done(function (response) {
526
+
527
+ $("#b_valid").html(response.error_b);
528
+
529
+ });
530
+
531
+ });
532
+
533
+ $("[name=c]").change(function () {
534
+
535
+ $.post("function-b.php", 'json', {
536
+
537
+ c: $("[name=c]").val()
538
+
539
+ }).done(function (response) {
540
+
541
+ $("#c_valid").html(response.error_c);
542
+
543
+ });
544
+
545
+ });
546
+
547
+ $("[name=d]").change(function () {
548
+
549
+ $.post("function-b.php", 'json', {
550
+
551
+ d: $("[name=d]").val()
552
+
553
+ }).done(function (response) {
554
+
555
+ $("#d_valid").html(response.error_d);
556
+
557
+ });
558
+
559
+ });
560
+
561
+ $("[name=f]").change(function () {
562
+
563
+ $.post("function-b.php", 'json', {
564
+
565
+ f: $("[name=f]").val()
566
+
567
+ }).done(function (response) {
568
+
569
+ $("#f_valid").html(response.error_f);
570
+
571
+ });
572
+
573
+ });
574
+
575
+ /*.fail(function(response){
576
+
577
+ });*/
578
+
579
+ });
396
580
 
397
581
  ```
398
582