teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

1

sample

2020/07/11 15:57

投稿

yambejp
yambejp

スコア117944

answer CHANGED
@@ -5,4 +5,59 @@
5
5
  ajaxで送る先はAPIであくまで送信データをサーバーサイドで
6
6
  活用し結果を返す処理だけします。
7
7
  当然同じファイルをwindow.openしても先程の通信とは別で開くので
8
- ajaxで以前送ったデータは保持されていません
8
+ ajaxで以前送ったデータは保持されていません
9
+
10
+ # sample
11
+ - mypage.html
12
+ ```HTML
13
+ <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
14
+ <script>
15
+ $(function(){
16
+ $('#btn').on('click',function(){
17
+ var basicinfo = {
18
+ name: "hoge",
19
+ scoreNum: 123
20
+ };
21
+ $.ajax({
22
+ url:'myapi.php',
23
+ type:'POST',
24
+ data:basicinfo,
25
+ }).done(function(data) {
26
+ var nWin=window.open('newpage.html');
27
+ nWin.addEventListener('load',function(){
28
+ nWin.document.querySelector('#view').textContent=data;
29
+ });
30
+ }).fail(function(XMLHttpRequest, textStatus, errorThrown) {
31
+ alert("error");
32
+ });
33
+ });
34
+ });
35
+ </script>
36
+ <input type="button" value="open" id="btn">
37
+ ```
38
+ - myapi.php
39
+ ```PHP
40
+ <?php
41
+ $name=$_POST['name'];
42
+ $scoreNum=$_POST['scoreNum'];
43
+ $result = 'name:' . $name . ' scoreNum:' . $scoreNum;
44
+ echo $result;
45
+ ```
46
+ - newpage.html
47
+ ```HTML
48
+ <!doctype html>
49
+ <html lang="ja">
50
+ <head>
51
+ <!-- Required meta tags -->
52
+ <meta charset="utf-8">
53
+ <meta name="viewport">
54
+
55
+ <title>PHP</title>
56
+ <body>
57
+ <main>
58
+ <pre id="view">
59
+ </pre>
60
+ </main>
61
+ </body>
62
+ </html>
63
+ ```