我想使用webstorage来保存并获得一些价值。 这是我的代码:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Note app</title>
<link rel="stylesheet" href="CSS/jquery.mobile-1.4.5.css">
<script src="JS/jquery.js"></script>
<script src="JS/jquery.mobile-1.4.5.js"></script>
<script type="text/javascript">
function saveNote() {
localStorage.setItem("note", jQuery("#note").val());
function retrieveNote() {
jQuery('#note').val(localStorage.getItem("note"));
}
</script>
</head>
<body>
<div data-role="page"id="Home">
<div data-role="header">
<h1>Note app</h1>
</div>
<div role="main" class="ui-content">
<textarea type="text" id="note" class="input-inline"></textarea>
<a href="#" data-role="button" onclick="saveNote()" style="width:120px;margin:auto">Save note</a>
<a href="#" data-role="button" onclick="retrieveNote()" style="width:150px;margin:auto">Retrieve note</a>
</div>
<div data-role="footer">
<h1>test</h1>
</div>
</div>
</body>
</html>
当我点击检索/保存按钮时,事情就是没有任何进展。我该怎么做才能使这个按钮工作? 我正在http://www.w3schools.com/jquerymobile/tryit.asp?filename=tryjqmob_start
进行测试答案 0 :(得分:1)
你很亲密,但有几个错误。首先你需要关闭你的第一个功能。
请参阅下面的工作代码。
<script>
function saveNote() {
localStorage.setItem("note", jQuery("#note").val());
}
function retrieveNote() {
jQuery('#noteRetrieve').text(localStorage.getItem("note"));
}
</script>
<div data-role="page" id="Home">
<div data-role="header">
<h1>Note app</h1>
</div>
<div role="main" class="ui-content">
<textarea type="text" id="note" class="input-inline"></textarea>
<div id="noteRetrieve"></div>
<a href="#" data-role="button" onclick="saveNote()" style="width:120px;margin:auto">Save note</a>
<a href="#" data-role="button" onclick="retrieveNote()" style="width:150px;margin:auto">Retrieve note</a>
</div>
<div data-role="footer">
<h1>test</h1>
</div>
</div>
答案 1 :(得分:0)
您的功能应该关闭。 它应该有适当的开始{和正确的结束}。
除此之外,它应该工作正常。 您可以阅读有关webstorage here的更多信息。