Здравствуйте, я столкнулся с проблемой создавая свой первый сайт. В нём есть только не рабочая система комментариев. Я бы хотел что-бы хоть она работала. Комментарии отправляются, но не отображаются другим пользователям, в этом и есть проблема, которую я не могу решить сам. Вот сам сайт
http://walls-one.space/walls-one?
код html
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="keywords" content="Стена, общение, разговор, walls, стены">
<meta name="description" content="Стены, как ещё сказать, стена и всё">
<link href="walls1.css" rel="stylesheet">
<link rel="shortcut icon" href="/cfgn/walls1.png" type="image/png">
<title>
walls-one
</title>
</head>
<body>
<header>
<h1>
Стена 1, Общайтесь где и как удобно,и о чём угодно...
<p>Сайт в разработке</p>
</h1>
<p>
<strong> Мы не несём какой либо ответственности за сказанное или написанное посетителями. Сайт предназначен только для общения.</strong>
</p>
</header>
<main>
<nav>
<a href="#new">Новые сообщения</a>
</nav>
<section>
<h2>начинай общение здесь:</h2>
<div class="container">
<div class="row">
<aside>
<align=left>
<div id="message-field">
</div>
</align>
</aside>
<form>
<h2>
<div class="form-group">
<label for="message-name">Имя:</label>
<input type="name" class="form-control" id="message-name" placeholder="Enter your name">
</div>
<div class="form-group">
<p><label for="message-body">Сообщение:</label>
<textarea type="password" class="form-control" id="message-body" placeholder="message"></textarea>
</div></p>
<p><div class="form-group form-check text-right">
<button type="submit" id="message-add" class="btn btn-primary">Отправить</button>
</div></p>
</h2>
</form>
</div>
</div>
<script src="jss.js"></script>
</main>
<footer>
<p id="new">Пока что всё.</p>
<p><strong> Мы не несём какой либо ответственности за сказанное или написанное посетителями. Сайт предназначен только для общения.</strong></p>
</footer>
</body>
</html>
Код JS
let messages = [];
loadMessages();
document.getElementById('message-add').onclick = function(){
let messageName = document.getElementById('message-name');
let messageBody = document.getElementById('message-body');
let message = {
name : messageName.value,
body : messageBody.value,
time : Math.floor(Date.now() / 1000)
}
messageName.value = '';
messageBody.value = '';
messages.push(message);
saveMessages();
showMessages();
}
function saveMessages(){
localStorage.setItem('messages', JSON.stringify(messages));
}
function loadMessages(){
if (localStorage.getItem('messages')) messages = JSON.parse(localStorage.getItem('messages'));
showMessages();
}
function showMessages (){
let messageField = document.getElementById('message-field');
let out = '';
messages.forEach(function(item){
out += `<p class="text-right small"><em>${timeConverter(item.time)}</em></p>`;
out += `<p class="alert alert-primary" role="alert"><h4>"${item.name}"</h4> напечатал:</p>`;
out += `<p class="alert alert-success" role="alert"><h5>${item.body}</h5></p>`;
});
messageField.innerHTML = out;
}
function clearStorage () {
localStorage.clear();
}
function timeConverter(UNIX_timestamp){
var a = new Date(UNIX_timestamp * 1000);
var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
var year = a.getFullYear();
var month = months[a.getMonth()];
var date = a.getDate();
var hour = a.getHours();
var min = a.getMinutes();
var sec = a.getSeconds();
var time = date + ' ' + month + ' ' + year + ' ' + hour + ':' + min + ':' + sec ;
return time;
}
Код CSS вряд ли отосится к этой проблеме.
Заранее спасибо.