如何解决子iframe没有收到触摸事件
我有如下代码;<div id=\"scroller\" style=\"width: 50%; overflow: auto;\">
<iframe height=\"100%\" id=\"iframe\" scrolling=\"no\" width=\"100%\" id=\"iframe\" src=\"responses.html\" />
</div>
现在,我希望iframe数据表在iPad的主页中滚动。
我在iframe页面上使用了js来监听触摸事件touchstart,touchmove等
但是由于某些原因,这些事件从未在iPad上触发。
我也尝试过
var startY = 0;
var startX = 0;
document.addEventListener(\"touchstart\",function (event) {
alert(11);
parent.window.scrollTo(0,1);
startY = event.targettouches[0].pageY;
startX = event.targettouches[0].pageX;
});
document.addEventListener(\"touchmove\",function (event) {
event.preventDefault();
var posy = event.targettouches[0].pageY;
var h = parent.document.getElementById(\"scroller\");
var sty = h.scrollTop;
var posx = event.targettouches[0].pageX;
var stx = h.scrollLeft;
h.scrollTop = sty - (posy - startY);
h.scrollLeft = stx - (posx - startX);
startY = posy;
startX = posx;
});
请你帮助我好吗。谢谢...
解决方法
1)从iframe中取出重复的“ 2”标签:
<iframe height=\"100%\" id=\"iframe\" scrolling=\"no\" width=\"100%\" src=\"responses.html\" />
2)添加到您的CSS:
#scroller {
z-index:-1;
}
#iframe {
z-index:1;
}
看看是否有效果。如果没有,您可以随时使用AJAX。
确保页面上包含jquery,然后:
<script>
$.ajax({
url: \"responses.html\",cache: false,success: function(html){
$(\"#results\").append(html);
}
});
</script>
<div id=\"results\" height=\"100%\" width=\"100%\"></div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。