Использование локального хранилища, позволяющее кому-то комментировать, а затем показывать сохраненные комментарии

-4

Некоторые элементы разных скриптов работают, но я не могу заставить сохраненные комментарии появляться в нижней части страницы. Любые предложения, почему некоторые части не работают? Когда кто-то пишет там имя и в текстовом поле, и я нажимаю кнопку "Очистить", он очищает указанные поля, но я не могу получить комментарии, сохраненные и отображаемые на странице. Что я сделал не так?

   <!DOCTYPE html>
<head>
<meta http-equiv="Content-type" content="text/html;charset=utf-
8" />
<title>Matthew comments</title>
<link rel="stylesheet" href="stylesheet.css" type="text/css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="myScript.js"></script>

<script>
function clearComment(){
$('#txt1').val('');
};

</script>

<script>
function saveComment()
var ctext = $('#txt1').val()
var cname = $('#namebox').val()
if (cname === 'Name'){cname = 'Anon';
alert(‘saveComment cname=+cname+ ctext=+ctext)
};

</script>

<script>

var cmtlist = ‘<p><span class="cmtname"+cname+
</span>'+ctext+</p>;
$(‘#cmtlist).empty();
$(‘#cmtlist).append(cmtlist);

</script>

<script type="text/javascript">
// utility functions for localstorage
function setObject(key, value) {
window.localStorage.setItem(key,
JSON.stringify(value));
};
function getObject(key) {
var storage = window.localStorage;
var value = storage.getItem(key);
return value && JSON.parse(value);
};
function clearStorage() {
// removes everything placed in localstorage
window.localStorage.clear();
};
</script>

<script>
var cmtlist = $('#cmtlist').html();
cmtlist = ‘<p><span class="cmtname"+cname+
‘</span >+ctext+</p>+cmtlist;
setObject('cmtlist', cmtlist);
var cmtlist = getObject('cmtlist');
if (getObject('cmtlist') === null){
var cmtlist = '';
} else {
var cmtlist = getObject('cmtlist');
};
if ($('#txt1').val() === 'CLEAR ALL STORAGE NOW!'){
clearStorage();
};
</script>

</head>
<body>
<header id="banner">
<dl>
<dt>Matthew Wilson</dt><dd>
<imgsrc="http://www.uea.ac.uk/documents/2397319/2396777/UEA+logo/bc91b5b5-ab8e-4673-b1e6-1a4a9fd918ab?t=1359129534719" alt="sloth" /></dd>
</dl>
</header>
<nav>

<button class="navbutton" onClick="clearComment()">Clear Comment</button>
<button class="navbutton" onClick="saveComment()">Save Comment </button>

</nav>
<div id="main">

<div id="dtext">
<h4>Your comment</h4>
<input id="namebox" type="text" maxlength="32" size="20"
value="Name" />
<br />
<textarea id="txt1" class="textbox" rows="6"></textarea>

</div>

<h4>Comments</h4>
<div id="cmtlist">

</div>

</div>
</body>
</html>

спросил(а) 2014-10-15T14:39:00+04:00 6 лет, 6 месяцев назад
0
61

Попробуй это:

HTML
<button class="navbutton" onClick="clearComment()">Clear Comment</button>
<button class="navbutton" onClick="saveComment()">Save Comment </button>

<div id="dtext">
<h4>Your comment</h4>
<input id="namebox" type="text" maxlength="32" size="20" placeholder="Name" />
<br />
<textarea id="txt1" class="textbox" rows="6" placeholder="Your comment"></textarea>
</div>

<h4>Comments</h4>
<div id="cmtlist"></div>

Javascript

// utility functions for localstorage
function setObject(key, value) {
window.localStorage.setItem(key, JSON.stringify(value));
}
function getObject(key) {
var storage = window.localStorage,
value = storage.getItem(key);
return value && JSON.parse(value);
}
function clearStorage() {
window.localStorage.clear();
}

// Clear inputfields and localstorage
function clearComment(){
$('#txt1').val('');
$('#namebox').val('');
clearStorage();
}

function saveComment(){
var cText = $('#txt1').val(),
cName = $('#namebox').val(),
cmtList = getObject('cmtlist');

if (cmtList){
cmtList.push({name: cName, text: cText});
setObject('cmtlist', cmtList);
}else{ //Add a comment
setObject('cmtlist', [{name: cName, text: cText}]);
}

bindCmt();
}

function bindCmt(){
var cmtListElement = $('#cmtlist'),
cmtList = getObject('cmtlist');

//Out with the old
cmtListElement.empty();
//And in with the new
$.each(cmtList, function(i, k){
cmtListElement.append( $('<p><span>'+ k.name +'</span>'+ k.text +'</p>') );
});
}

//Get the comments on page ready
$(function(){
bindCmt();
});

ответил(а) 2014-10-15T22:17:00+04:00 6 лет, 5 месяцев назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема