Это основная часть кода. В основном я пытаюсь написать клиентскую страницу для чат-сервера. Предполагая, что взаимодействие с сервером верное, страница никогда не сможет принимать сообщения, отправленные с сервера, потому что страница обновляется каждый раз, когда я нажимаю , введите. Код должен отправить сообщение на сервер, а затем сервер отправит сообщение всем подключенным клиентам, а клиент добавит сообщение в конец списка.Я пытаюсь создать чат для веб-страницы, и он продолжает перезагружать, когда я нажимаю enter. Может ли кто-нибудь сказать мне, почему это может произойти?
<!DOCTYPE html>
<html>
<head>
<title>Chat</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="http://localhost:4000/static/_stylesGlobal.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
<script>
function sendChat(msg)
{
socket.emit('newMessage', {message:msg});
console.log("Sent by User: %s", msg);
}
function updateChatLog(msg)
{
$("#chatLog").append(msg.message + "<br>");
console.log(msg.message);
}
function msgReceived(msg)
{
$("clientCount").html(msg.clients);
}
function clientUpdate (msg)
{
$("#clientCount").text(msg.clients);
}
$(document).ready(function() {
$("#clientCount").text("0");
socket = io.connect('http://localhost:4000');
socket.on('mUpdate',function(msg){updateChatLog(msg); msgReceived(msg);});
socket.on('nClientUpdate',function(msg){clientUpdate(msg);});
$("#enterChat").click(function() {
var messageValue = $("#chatMessage").val();
console.log("Entered by User: %s", messageValue);
sendChat(messageValue);
});
});
</script>
</head>
<body>
<header role="banner" >
<h1>Chat</h1>
</header>
<nav role="navigation" id = "main_nav_bar">
<ul>
<li id="homenav"><a href="http://localhost:4000/">Home</a></li>
<li id="calculatornav"><a href="http://localhost:4000/static/calculator.html">Calculator</a></li>
<li id="logbooknav"><a href="http://localhost:4000/static/logbook.html">Logbook</a></li>
<li id="gallerynav"><a href="http://localhost:4000/static/gallery.html">Gallery</a></li>
<li id="downloadnav"><a href="http://localhost:4000/static/download.html">Download</a></li>
<li id="chatnav"><a href="http://localhost:4000/static/chat.html">Chat</a></li>
</ul>
</nav>
<main>
<div id="chatWindow">
<h3>Welcome To Chat</h3>
<div id="chatLog"></div>
</div>
<form id="chatInput">
<p><span id="clientCount">0</span> Online Now</p>
<br>
<input type="text" id="chatMessage" value="Your Message Here !" style="width: 100%;">
<br>
<input type="submit" value="Enter" href="#chatInput" id="enterChat">
</form>
</main>
<footer role="contentinfo">
</footer>
</body>
</html>
Основной виновник этой перезагрузка является ввести чат функции:
$("#enterChat").click(function() {
var messageValue = $("#chatMessage").val();
console.log("Entered by User: %s", messageValue);
sendChat(messageValue);
});
Если кто-то может мне точку в направлении, почему страница перезагрузки я мог работать в направлении увидеть, если сообщение от сервера передается должным образом. Кроме того, я был бы очень признателен.