回答編集履歴
1
修正
answer
CHANGED
@@ -14,4 +14,32 @@
|
|
14
14
|
<input type="checkbox" name="name3" id="check3"><label for="check3">同意します-3</label>
|
15
15
|
|
16
16
|
<button type="submit" id="btn">すべて同意して送信</button>
|
17
|
+
```
|
18
|
+
|
19
|
+
# 追記
|
20
|
+
|
21
|
+
classの処理もありましたね、ではこうで
|
22
|
+
```
|
23
|
+
<style>
|
24
|
+
.inactive{
|
25
|
+
background-Color:red;
|
26
|
+
}
|
27
|
+
</style>
|
28
|
+
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
|
29
|
+
<script>
|
30
|
+
$(function(){
|
31
|
+
$("#check1,#check2,#check3").on('change',function(){
|
32
|
+
var flg=$("#check1,#check2,#check3").filter(':checked').length<3;
|
33
|
+
$("#btn")
|
34
|
+
.prop('disabled',flg)
|
35
|
+
.toggleClass('inactive',flg);
|
36
|
+
}).change();
|
37
|
+
});
|
38
|
+
</script>
|
39
|
+
|
40
|
+
<input type="checkbox" name="name1" id="check1"><label for="check1">同意します-1</label>
|
41
|
+
<input type="checkbox" name="name2" id="check2"><label for="check2">同意します-2</label>
|
42
|
+
<input type="checkbox" name="name3" id="check3"><label for="check3">同意します-3</label>
|
43
|
+
|
44
|
+
<button type="submit" id="btn">すべて同意して送信</button>
|
17
45
|
```
|