質問編集履歴
6
実現したい具体的な説明
title
CHANGED
File without changes
|
body
CHANGED
File without changes
|
5
現在のコード実行時の画像の添付と具体的に改善したい点
title
CHANGED
File without changes
|
body
CHANGED
@@ -8,73 +8,11 @@
|
|
8
8
|
Web上の更新ボタンを押すと全てのメッセージの日時が更新されてしまう。
|
9
9
|
|
10
10
|
### 該当のソースコード
|
11
|
-
html
|
12
|
-
<div>
|
13
|
-
<div class="header"><p>CHAT</p></div>
|
14
|
-
</div>
|
15
|
-
<div class="chat-area">
|
16
|
-
<div class="kakomi-maru">
|
17
|
-
<div>名前: <input type="text" id="uname">
|
18
|
-
</div>
|
19
|
-
<div>
|
20
|
-
<textarea id="text" cols="80%" rows="5"></textarea>
|
21
|
-
<button id="send">投稿する</button>
|
22
|
-
</div>
|
23
|
-
<div class id="chat-hukidashi">
|
24
|
-
<div id="output">
|
25
|
-
</div>
|
26
|
-
</div>
|
27
|
-
</div>
|
28
|
-
</div>
|
29
|
-
</div>
|
30
11
|
|
12
|
+
|
31
13
|
javascript
|
32
|
-
<script>
|
33
|
-
// Your web app's Firebase configuration
|
34
|
-
var firebaseConfig = {
|
35
|
-
apiKey: "AIzaSyA5FeZ5n53RhH029rB4oG7lXpGDkFKzuYg",
|
36
|
-
authDomain: "gsdemo-22f2a.firebaseapp.com",
|
37
|
-
databaseURL: "https://gsdemo-22f2a.firebaseio.com",
|
38
|
-
projectId: "gsdemo-22f2a",
|
39
|
-
storageBucket: "gsdemo-22f2a.appspot.com",
|
40
|
-
messagingSenderId: "830068457806",
|
41
|
-
appId: "1:830068457806:web:7860391950f4b1bec7de1f"
|
42
|
-
};
|
43
|
-
// Initialize Firebase
|
44
|
-
firebase.initializeApp(firebaseConfig);
|
45
14
|
|
46
|
-
const ref = firebase.database().ref();
|
47
15
|
|
48
|
-
|
49
|
-
//送信
|
50
|
-
$("#send").on("click", function(){
|
51
|
-
const uname = $("#uname").val();
|
52
|
-
const text = $("#text").val();
|
53
|
-
var now = new Date().getTime();
|
54
|
-
|
55
|
-
const msg = {
|
56
|
-
uname: uname,
|
57
|
-
text: text,
|
58
|
-
timestamp: now
|
59
|
-
};
|
60
|
-
ref.push(msg);
|
61
|
-
});
|
62
|
-
|
63
|
-
$("#text").on("keydown", function(e){
|
64
|
-
if(e.keyCode==13){
|
65
|
-
const uname = $("#uname").val();
|
66
|
-
const text = $("#text").val();
|
67
|
-
var now = new Date().getTime();
|
68
|
-
|
69
|
-
const msg = {
|
70
|
-
uname: uname,
|
71
|
-
text: text,
|
72
|
-
timestamp: now
|
73
|
-
};
|
74
|
-
ref.push(msg);
|
75
|
-
}
|
76
|
-
});
|
77
|
-
|
78
16
|
//受信
|
79
17
|
ref.on("child_added",function(data){
|
80
18
|
const v = data.val();
|
4
実現したい具体的な説明
title
CHANGED
File without changes
|
body
CHANGED
@@ -8,26 +8,95 @@
|
|
8
8
|
Web上の更新ボタンを押すと全てのメッセージの日時が更新されてしまう。
|
9
9
|
|
10
10
|
### 該当のソースコード
|
11
|
+
html
|
12
|
+
<div>
|
13
|
+
<div class="header"><p>CHAT</p></div>
|
14
|
+
</div>
|
15
|
+
<div class="chat-area">
|
16
|
+
<div class="kakomi-maru">
|
17
|
+
<div>名前: <input type="text" id="uname">
|
18
|
+
</div>
|
19
|
+
<div>
|
20
|
+
<textarea id="text" cols="80%" rows="5"></textarea>
|
21
|
+
<button id="send">投稿する</button>
|
22
|
+
</div>
|
23
|
+
<div class id="chat-hukidashi">
|
24
|
+
<div id="output">
|
25
|
+
</div>
|
26
|
+
</div>
|
27
|
+
</div>
|
28
|
+
</div>
|
29
|
+
</div>
|
30
|
+
|
11
31
|
javascript
|
32
|
+
<script>
|
33
|
+
// Your web app's Firebase configuration
|
34
|
+
var firebaseConfig = {
|
35
|
+
apiKey: "AIzaSyA5FeZ5n53RhH029rB4oG7lXpGDkFKzuYg",
|
36
|
+
authDomain: "gsdemo-22f2a.firebaseapp.com",
|
37
|
+
databaseURL: "https://gsdemo-22f2a.firebaseio.com",
|
38
|
+
projectId: "gsdemo-22f2a",
|
39
|
+
storageBucket: "gsdemo-22f2a.appspot.com",
|
40
|
+
messagingSenderId: "830068457806",
|
41
|
+
appId: "1:830068457806:web:7860391950f4b1bec7de1f"
|
42
|
+
};
|
43
|
+
// Initialize Firebase
|
44
|
+
firebase.initializeApp(firebaseConfig);
|
12
45
|
|
46
|
+
const ref = firebase.database().ref();
|
47
|
+
|
48
|
+
|
49
|
+
//送信
|
50
|
+
$("#send").on("click", function(){
|
51
|
+
const uname = $("#uname").val();
|
52
|
+
const text = $("#text").val();
|
53
|
+
var now = new Date().getTime();
|
54
|
+
|
55
|
+
const msg = {
|
56
|
+
uname: uname,
|
57
|
+
text: text,
|
58
|
+
timestamp: now
|
59
|
+
};
|
60
|
+
ref.push(msg);
|
61
|
+
});
|
62
|
+
|
63
|
+
$("#text").on("keydown", function(e){
|
64
|
+
if(e.keyCode==13){
|
65
|
+
const uname = $("#uname").val();
|
66
|
+
const text = $("#text").val();
|
67
|
+
var now = new Date().getTime();
|
68
|
+
|
69
|
+
const msg = {
|
70
|
+
uname: uname,
|
71
|
+
text: text,
|
72
|
+
timestamp: now
|
73
|
+
};
|
74
|
+
ref.push(msg);
|
75
|
+
}
|
76
|
+
});
|
77
|
+
|
13
|
-
//受信
|
78
|
+
//受信
|
14
79
|
ref.on("child_added",function(data){
|
15
80
|
const v = data.val();
|
16
|
-
const k = data.key;
|
81
|
+
const k = data.key;
|
17
82
|
|
18
83
|
var date = new Date();
|
84
|
+
date.setTime(v.timestamp);
|
19
85
|
var month = date.getMonth() + 1;
|
20
86
|
var day = date.getDate();
|
21
87
|
var hours = date.getHours();
|
22
88
|
var minutes = date.getMinutes();
|
23
|
-
var time = (time = month + "/" + day + " " + hours + ":" + minutes);
|
89
|
+
var time = (time = month + "/" + day + " " + hours + ":" + minutes);
|
24
|
-
|
90
|
+
|
25
|
-
const h = '<p>'+v.uname+'<br>'+v.text+'<br>'+time+'</p>';
|
91
|
+
const h = '<p>'+"名前: "+v.uname+'<br>'+v.text+'<br>'+"投稿時刻:"+time+'</p>';
|
26
92
|
$("#output").prepend(h);
|
27
93
|
});
|
28
94
|
|
29
95
|
|
96
|
+
</script>
|
30
97
|
|
98
|
+
|
99
|
+
|
31
100
|
### 試したこと
|
32
101
|
|
33
102
|
日時を設定するidを作成したりしましたが、エラーになり混乱しています。
|
3
現在のコード実行時の画像の添付と具体的に改善したい点
title
CHANGED
File without changes
|
body
CHANGED
@@ -1,5 +1,5 @@
|
|
1
|
-
![イメージ説明]
|
2
|
-

|
2
|
+
### 前提・実現したいこと
|
3
3
|
javascript(html.css)でチャットアプリを作っています。
|
4
4
|
メッセージの送信日時表示する機能を実装中なのですが、更新ボタンを押すと全てのメッセージの送信日時が更新されてしまいます。
|
5
5
|
(画像では青い枠と書いてありますが画像編集の過程でグレーになってしまいました。)
|
2
実現したい具体的な説明(画像)
title
CHANGED
File without changes
|
body
CHANGED
@@ -1,7 +1,8 @@
|
|
1
|
+
![イメージ説明]
|
1
|
-
説明](d33831a5e6867f3ca38a2fccf327ae7f.jpeg)](56b2f90734721031216ebf97779bd2e4.jpeg)### 前提・実現したいこと
|
2
3
|
javascript(html.css)でチャットアプリを作っています。
|
3
4
|
メッセージの送信日時表示する機能を実装中なのですが、更新ボタンを押すと全てのメッセージの送信日時が更新されてしまいます。
|
4
|
-
|
5
|
+
(画像では青い枠と書いてありますが画像編集の過程でグレーになってしまいました。)
|
5
6
|
### 発生している問題・エラーメッセージ
|
6
7
|
|
7
8
|
Web上の更新ボタンを押すと全てのメッセージの日時が更新されてしまう。
|
1
現在のコード実行時の画像の添付と具体的に改善したい点
title
CHANGED
File without changes
|
body
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
### 前提・実現したいこと
|
1
|
+
### 前提・実現したいこと
|
2
2
|
javascript(html.css)でチャットアプリを作っています。
|
3
3
|
メッセージの送信日時表示する機能を実装中なのですが、更新ボタンを押すと全てのメッセージの送信日時が更新されてしまいます。
|
4
4
|
|