0
我正在使用iScroll访问我的phonegap应用程序之一。我的模板是这样设置的。我有index.html。我通过jQuery load()方法动态加载页面。所以会发生的是当我启动应用程序,然后它动态加载login.html。之后我使用iscroll刷新方法。因此,当我滚动第一个页面直到页面结束时它就起作用,但当我想第二次滚动页面时,它不会滚动。并为此,我得到这个错误在我的logcatiscroll不起作用
Miss a drag as we are waiting for WebCore's response for touch down
我怎样才能使它工作?
这里是我的index.html
<header>
Header
</header>
<div id="wrapper">
<div id="scroll-content">
</div>
</div>
<footer>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Profile</a></li>
<li><a href="#">Photos</a></li>
</ul>
</footer>
</body>
<script type="text/javascript">
var theScroll;
function scroll() {
theScroll = new iScroll('wrapper', { vScrollbar: true });
}
document.addEventListener('DOMContentLoaded', scroll, false);
</script>
,这里是我的JS文件
jQuery(function() {
var myScroll = new iScroll('wrapper');
var Login = {
onDeviceReady : function() {
$('#scroll-content').load('./pages/login.html', function() {
setTimeout(function() {
myScroll.refresh();
}, 0);
});
$(document).on('touchstart', '#btnlogin', Login.validate);
},
validate : function (e) {
e.preventDefault();
var input;
$('#loginform input').each(function() {
input = $(this).val();
if(input == "") {
$(".errormsg").html('Enter all mandatory fields');
$(this).addClass('error');
}
});
}
};
document.addEventListener("deviceready", Login.onDeviceReady, false);
});
这里是我的CSS
footer {
background-color: #c27b00;
position: absolute;
z-index: 2;
bottom: 0;
left: 0;
width: 100%;
height: 48px;
padding: 0;
border-top: 1px solid #444; }
footer ul {
margin: 0;
padding: 0; }
footer ul li {
display: inline-block;
padding: 5% 10.5%;
background-color: #fafafa; }
footer ul li a {
width: 100%;
height: 100%; }
body #wrapper {
position: absolute;
z-index: 1;
top: 45px;
bottom: 48px;
left: 0;
width: 100%;
background: #aaa;
overflow: auto; }
body #wrapper #scroll-content {
position: absolute;
z-index: 1;
width: 100%;
padding: 0; }
为什么使用2个iscrolls?你有scroll和myScroll – jcesarmobile
@jcesar好点。删除Scroll后,它可以工作:-)。 – 2619