回答編集履歴

5

ちょうせい

2022/10/28 06:04

投稿

yambejp
yambejp

スコア115012

test CHANGED
@@ -45,6 +45,7 @@
45
45
  ```
46
46
 
47
47
  # 非推奨:IE対応版
48
+ ※微調整
48
49
  ```javascript
49
50
  <script>
50
51
  document.addEventListener('submit', function(e){
@@ -57,6 +58,9 @@
57
58
  f2=document.createElement('form');
58
59
  f2.id="f2";
59
60
  f2.hidden=true;
61
+ f2.target=f1.target;
62
+ f2.action=f1.action;
63
+ f2.hidden=true;
60
64
  var list=["hoge","fuga"];
61
65
  list.forEach(function(x){
62
66
  var ele=document.createElement('input');
@@ -68,13 +72,13 @@
68
72
  f2.submit();
69
73
  });
70
74
  </script>
71
- <form method="get">
75
+ <form name="form1" method="get" action="https://test.co.jp/" target="_blank">
72
76
  <label><input type="checkbox" name="hoge" value="1">hoge1<label>
73
77
  <label><input type="checkbox" name="hoge" value="2">hoge2<label>
74
78
  <label><input type="checkbox" name="hoge" value="3">hoge3<label>
75
79
  <label><input type="checkbox" name="fuga" value="4">fuga4<label>
76
80
  <label><input type="checkbox" name="fuga" value="5">fuga5<label>
77
81
  <label><input type="checkbox" name="fuga" value="6">fuga6<label>
78
- <input type="submit" value="送信"/>
82
+ <input type="submit" value="送信">
79
83
  </form>
80
84
  ```

4

さんこう

2022/10/28 04:07

投稿

yambejp
yambejp

スコア115012

test CHANGED
@@ -43,3 +43,38 @@
43
43
  <input type="submit" value="送信" />
44
44
  </form>
45
45
  ```
46
+
47
+ # 非推奨:IE対応版
48
+ ```javascript
49
+ <script>
50
+ document.addEventListener('submit', function(e){
51
+ e.preventDefault();
52
+ var f1=e.target;
53
+ var f2=document.querySelector('#f2');
54
+ if(f2){
55
+ f2.parentNode.removeChild(f2);
56
+ }
57
+ f2=document.createElement('form');
58
+ f2.id="f2";
59
+ f2.hidden=true;
60
+ var list=["hoge","fuga"];
61
+ list.forEach(function(x){
62
+ var ele=document.createElement('input');
63
+ ele.name=x;
64
+ ele.value=[].filter.call(f1,function(y){return y.name==x && y.checked;}).map(function(x){return x.value}).join(' ');
65
+ f2.appendChild(ele);
66
+ });
67
+ document.body.appendChild(f2);
68
+ f2.submit();
69
+ });
70
+ </script>
71
+ <form method="get">
72
+ <label><input type="checkbox" name="hoge" value="1">hoge1<label>
73
+ <label><input type="checkbox" name="hoge" value="2">hoge2<label>
74
+ <label><input type="checkbox" name="hoge" value="3">hoge3<label>
75
+ <label><input type="checkbox" name="fuga" value="4">fuga4<label>
76
+ <label><input type="checkbox" name="fuga" value="5">fuga5<label>
77
+ <label><input type="checkbox" name="fuga" value="6">fuga6<label>
78
+ <input type="submit" value="送信"/>
79
+ </form>
80
+ ```

3

追記

2022/10/06 03:33

投稿

yambejp
yambejp

スコア115012

test CHANGED
@@ -17,3 +17,29 @@
17
17
  <input type="submit" value="送信" />
18
18
  </form>
19
19
  ```
20
+
21
+ # 複数パラメータ対応
22
+ hoge/fugaの2つの要素を取得する方法です。
23
+ listの要素を増やせばいくつでも指定できるはずです。
24
+ ```javascript
25
+ <script>
26
+ window.addEventListener('formdata', (e)=>{
27
+ const fd=e.formData;
28
+ const list=["hoge","fuga"];
29
+ list.forEach(x=>{
30
+ const data=fd.getAll(x);
31
+ fd.delete(x);
32
+ if(data.length) fd.append(x,data.join(' '));
33
+ });
34
+ });
35
+ </script>
36
+ <form method="get">
37
+ <label><input type="checkbox" name="hoge" value="1">hoge1<label>
38
+ <label><input type="checkbox" name="hoge" value="2">hoge2<label>
39
+ <label><input type="checkbox" name="hoge" value="3">hoge3<label>
40
+ <label><input type="checkbox" name="fuga" value="4">fuga4<label>
41
+ <label><input type="checkbox" name="fuga" value="5">fuga5<label>
42
+ <label><input type="checkbox" name="fuga" value="6">fuga6<label>
43
+ <input type="submit" value="送信" />
44
+ </form>
45
+ ```

2

省略

2022/10/06 00:28

投稿

yambejp
yambejp

スコア115012

test CHANGED
@@ -1,9 +1,10 @@
1
1
  ```javascript
2
2
  <script>
3
3
  window.addEventListener('formdata', (e)=>{
4
+ const fd=e.formData;
4
- const hogedata=e.formData.getAll('hoge');
5
+ const hogedata=fd.getAll('hoge');
5
- e.formData.delete('hoge');
6
+ fd.delete('hoge');
6
- if(hogedata.length) e.formData.append('hoge',hogedata.join(' '));
7
+ if(hogedata.length) fd.append('hoge',hogedata.join(' '));
7
8
  });
8
9
  </script>
9
10
  <form method="get">

1

調整

2022/10/06 00:26

投稿

yambejp
yambejp

スコア115012

test CHANGED
@@ -3,7 +3,7 @@
3
3
  window.addEventListener('formdata', (e)=>{
4
4
  const hogedata=e.formData.getAll('hoge');
5
5
  e.formData.delete('hoge');
6
- e.formData.append('hoge',hogedata.join(' '));
6
+ if(hogedata.length) e.formData.append('hoge',hogedata.join(' '));
7
7
  });
8
8
  </script>
9
9
  <form method="get">