jQuery windows 移动应用程序“附加(html)不起作用”
Posted
技术标签:
【中文标题】jQuery windows 移动应用程序“附加(html)不起作用”【英文标题】:jQuery windows mobile app "append(html) not working" 【发布时间】:2013-12-22 00:28:30 【问题描述】:我正在尝试使用 phonegap for windows mobile 构建待办事项列表移动应用程序。 但是在单击“添加”按钮后,列表没有被添加。我的手机屏幕上没有显示任何列表项。但同样的工作在浏览器中非常好。谁能帮帮我!!
html和js代码
<!DOCTYPE html>
<html manifest="storage.appcache">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<script type="text/javascript" charset="utf-8" src="jquery.js"></script>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script type="text/javascript" charset="utf-8" src="cordova_plugins.js"></script>
<script type="text/javascript" charset="utf-8">
var storage = window.localStorage;
$(document).ready(function()
console.log('Inside document.ready');
initTodoList();
$("#clearStorage").click(function()
console.log('Entering clearstorage');
storage.clear();
$('li').remove();
console.log('Exiting clearstorage');
);
);
function remove_item(key)
console.log('Entering remove_item');
storage.removeItem(key);
console.log('Find and remove element with id = ' + key)
$('#'+key).remove();
console.log('Exiting remove_item');
function add_item()
console.log('Entering add_item');
var d = new Date();
var key = d.getTime();
var value = $('#new_item').val();
storage.setItem(key, value);
createToDoListItem(key, value);
$("#new_item").val('');
console.log('Exiting add_item');
function initTodoList()
console.log("Entering initTodoList " + storage.length);
for(var i = 0; i < storage.length; i++)
var key = storage.key(i);
var value = storage.getItem(key);
createToDoListItem(key,value);
function createToDoListItem(key, value)
var html = '<li data-key="' + key + '" id="' + key + '">' + value + '<button onclick="javascript:remove_item(\'' + key + '\')">Delete</button></li>';
console.log('Appending html ' + html)
$("#todo_list").append(html);
$("#todo_list").listview().listview("refresh");
</script>
</head>
<body>
<div class="app">
<h1>To Do List</h1>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript">
app.initialize();
</script>
<input type="text" id="new_item">
<button onclick="add_item()">Add</button>
<ul id="todo_list">
</ul>
<br/>
<button id="clearStorage">Clear storage</button>
</body>
</html>
【问题讨论】:
这个问题你解决了吗? 您使用的是哪个版本的 jquery? 【参考方案1】:console.log('Appending html ' + html)
行末尾缺少分号。
此外,如果可能,最好尝试在开发机器上的浏览器上调试 PhoneGap 网页,并在浏览器开发工具的控制台中检查错误。
(并不总是可以使用 PhoneGap 在本地计算机上调试页面,因为您有时需要访问移动功能等)
【讨论】:
以上是关于jQuery windows 移动应用程序“附加(html)不起作用”的主要内容,如果未能解决你的问题,请参考以下文章