不废话，直接上代码
<html>
<head>
<title>密码修改</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../css/jquery.mobile-1.0.1.min.css">
<script src="../js/jquery-1.7.1.min.js"></script>
<script src="../js/jquery.mobile-1.0.1.min.js"></script>
<link rel="stylesheet" href="../css/jquery.mobile.datebox.min.css">
<script src="../js/jquery.mobile.datebox.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="content" class="content">
<label for="mydate">生日：</label>
<input name="mydate" id="mydate" type="date" data-role="datebox" data-options='{"mode": "datebox"}'>
</div>
</div>
</body>
</html>如上页面，我是把它放在一个web工程里面的，用tomcat启起来，我在pc机上的chrome浏览器访问，是没有问题的，日期控件一切正常，然后我用android手机连上公司的无线，这样我的手机和我工作的电脑就是在一个局域网内了，接着我就用手机上自带的浏览器访问访问我电脑上的这个web工程，日期控件在手机上也是正常的。可是当我把此页面移动到一个phonegap项目里面，用webview加载访问显示此网页，然后把此项目打成apk，放到手机上，安装此程序，运行安装好的程序，日期控件效果就没有了，就失效了。后来改了一下databox.min.js和databox.min.css引入的地方，就ok了，不放在head里面，而是放在page里面。
<!DOCTYPE HTML>
<html>
<head>
<title>密码修改</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="../css/jquery.mobile-1.0.1.min.css">
<script src="../js/jquery-1.7.1.min.js"></script>
<script src="../js/jquery.mobile-1.0.1.min.js"></script>
</head>
<body>
<div data-role="page">
<link rel="stylesheet" href="../css/jquery.mobile.datebox.min.css">
<script src="../js/jquery.mobile.datebox.min.js"></script>
<div data-role="content" class="content">
<label for="mydate">生日：</label>
<input name="mydate" id="mydate" type="date" data-role="datebox" data-options='{"mode": "datebox"}'>
</div>
</div>
</body>
</html>
对此问题，我个人觉得是由于jquerymobile页面链接加载的时候，采用了ajax异步加载，整个页面不重新刷新，所以我把它写在head里面，并没有引用进来，而需要写在page里面。
277
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
