<!doctype html> <html> <head> <script src='https://cdn.firebase.com/v0/firebase.js'></script> <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js'></script> <link rel='stylesheet' type='text/css' href='../css/example.css'> </head> <body> <div id='messagesDiv'></div> <input type='text' id='nameInput' placeholder='Name'> <input type='text' id='messageInput' placeholder='Message'> <script> var myDataRef = new Firebase('https://khkf4d3b2ot.firebaseio-demo.com/'); $('#messageInput').keypress(function (e) { if (e.keyCode == 13) { var name = $('#nameInput').val(); var text = $('#messageInput').val(); myDataRef.push({name: name, text: text}); $('#messageInput').val(''); } }); myDataRef.on('child_added', function(snapshot) { var message = snapshot.val(); displayChatMessage(message.name, message.text); }); function displayChatMessage(name, text) { $('<div/>').text(text).prepend($('<em/>').text(name+': ')).appendTo($('#messagesDiv')); $('#messagesDiv')[0].scrollTop = $('#messagesDiv')[0].scrollHeight; }; </script> </body> </html>
var myDataRef = new Firebase('https://khkf4d3b2ot.firebaseio-demo.com/');
เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง
ผมลองทำตามโค้ดที่เค้าให้มาสรุปแล้วว่าได้ออกมาแบบนี้ ใครก็ได้ลองเอาโค้ดไปรันแล้วพิมพ์คุยกับผมทีครับว่ามันจะได้ยินกันจริงๆไหม
