[英]How to enable touch events on pjax library?
I am developing a site where I use Pjax library (a port of jquery pjax). 我正在开发一个使用Pjax库的站点(jquery pjax的端口)。 However the touch events don't go through. 但是,触摸事件不会进行。 I am using Pjax like so: 我正在像这样使用Pjax:
var pjax = new Pjax({ selectors: ["head title", "body"] })
and also have some animations: 还有一些动画:
document.addEventListener('pjax:send', function(){
var $main = document.querySelector('main')
$main.style.opacity = 0
})
document.addEventListener('pjax:complete', function(){
var $main = document.querySelector('main')
$main.style.visibility = 'hidden'
$main.style.opacity = 0
setTimeout(function(){
document.querySelector('main').style.visibility = 'visible'
document.querySelector('main').style.opacity = 1
attach_menu_control()
}, 10)
})
I need it to work on mobile. 我需要它才能在移动设备上工作。 The site is www.saulesinterjerai.lt (can be buggy) 该网站为www.saulesinterjerai.lt (可能有故障 )
I found the solution, it works by redirecting touch event to click event like this: 我找到了解决方案,它可以通过将touch事件重定向到click事件来实现,如下所示:
if (is_touch_device()) {
var all_links = document.querySelectorAll('a[href]')
var event = new Event('click');
for (var index = 0 ; index < all_links.length ; ++index) {
all_links[index].addEventListener("touchend", function() {
all_links[index].dispatchEvent(event)
});
}
}
function is_touch_device() {
return 'ontouchstart' in window // works on most browsers
|| navigator.maxTouchPoints; // works on IE10/11 and Surface
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.