在android上使用jquery mobile时,第二页上的javascript似乎被禁用
我正在尝试使用jQuery Mobile构建一个Web应用程序。 在我的桌面上进行测试时,一切正常。 在Android(3.2和4.0.3)上,在导航到第二页后,JavaScript似乎被禁用 我的第一页看起来像:在android上使用jquery mobile时,第二页上的javascript似乎被禁用,javascript,android,jquery,mobile,Javascript,Android,Jquery,Mobile,我正在尝试使用jQuery Mobile构建一个Web应用程序。 在我的桌面上进行测试时,一切正常。 在Android(3.2和4.0.3)上,在导航到第二页后,JavaScript似乎被禁用 我的第一页看起来像: <!DOCTYPE html> <html> <head> <title>Hello World</title> <meta http-equiv="Content-Type" content="text/html;
<!DOCTYPE html>
<html>
<head>
<title>Hello World</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="script/jquery.mobile-1.1.0/jquery.mobile-1.1.0.min.css" />
<script type="text/javascript" src="script/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="script/jquery.mobile-1.1.0/jquery.mobile-1.1.0.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header">
<h3>Jetty experiments:</h3>
</div>
<div data-role="content">
<ul data-role="listview">
<li><a href="HelloWorld" data-ajax="false">Hello World</a></li>
<li><a href="sample-form.html">Sample Form</a></li>
<li><a href="test.jsp" data-ajax="false">Test JSP</a></li>
</ul>
</div>
<div data-role="footer">
<button id="jquery-test">JQuery Test</button>
</div>
</div>
</body>
<script type="text/javascript">
$(document).ready(function() {
$("#jquery-test").click(function(event) {
alert("OK");
});
});
</script>
</html>
你好,世界
码头试验:
JQuery测试
$(文档).ready(函数(){
$(“#jquery测试”)。单击(函数(事件){
警报(“正常”);
});
});
我的第二个页面(即示例表单.html):
将文本收集到数据库中
输入一些文本:
- {{name}
- 抱歉,需要JavaScript李>
JQuery测试
变量名称;
$(文档).ready(函数(){
$(“#jquery测试”)。单击(函数(事件){
警报(“确定”);//此处的警报在Android上不起作用:(
});
名称=节奏准备(“名称”)
});
//此绑定在Android上不起作用
$(“#搜索表单”).submit(函数(事件){
event.preventDefault();
$.getJSON(“SampleForm”,函数(数据){
名称。呈现(数据);
});
});
知道我做错了什么吗?
比尔,
Adrian。在jQuery Mobile中,文档就绪事件只调用一次。链接页面加载到同一个DOM中,并触发页面初始化 还有一个问题:
<!DOCTYPE html>
<html>
<head>
<title>Collects text into a database</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="script/jquery.mobile-1.1.0/jquery.mobile-1.1.0.min.css" />
<script type="text/javascript" src="script/jquery-1.7.2.min.js"></script>
<script type="text/javascript"
src="script/jquery.mobile-1.1.0/jquery.mobile-1.1.0.min.js"></script>
<script type="text/javascript" src="script/tempo.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header">
<h3>Enter some text:</h3>
</div>
<div data-role="content">
<form id="searchForm" method="get" action="SampleForm"
data-ajax="false">
<input type="text" name="text" /> <input type="submit"
value="Submit" />
</form>
<ul id="names" data-role="listview">
<li data-template>{{name}}</li> <!-- the template here does not work on Android -->
<li data-template-fallback>Sorry, JavaScript required!</li>
</ul>
</div>
<div data-role="footer">
<button id="jquery-test">JQuery Test</button>
</div>
</div>
</body>
<script>
var names;
$(document).ready(function() {
$("#jquery-test").click(function(event) {
alert("OK"); // the alert here does not work on Android :(
});
names = Tempo.prepare("names")
});
// this binding does not work on Android
$("#searchForm").submit(function(event) {
event.preventDefault();
$.getJSON("SampleForm", function(data) {
names.render(data);
});
});
</script>
</html>