[英]jQuery: Prevent page scroll when user's finger touches an element
I'm using the following jQuery plugin: http://willowsystems.github.io/jSignature/ 我正在使用以下jQuery插件: http : //willowsystems.github.io/jSignature/
I'm trying to do something very simple which is stopping page scrolling when the user's finger is inside a signature area (the page movement when writing a signature on the phone is excruciatingly bad to the point where you can't write your signature at all). 我正在尝试做一个非常简单的操作,即当用户的手指在签名区域内时停止页面滚动(在手机上写签名时,页面移动非常糟糕,以至于根本无法写出签名) )。 I have tried the following which is not working in Firefox and I'm not sure why:
我尝试了以下在Firefox中不起作用的方法,但不确定为什么:
$('.signature').on('touchmove', function(e) {
e.preventDefault();
});
I have also tried this which isn't working either: 我也尝试过这不起作用:
$(document).delegate('.signature', 'touchmove', false);
I've searched for hours and I can't seem to find anything that works. 我搜索了几个小时,但似乎找不到任何有效的方法。 If anymore detail is required please let me know and I will happily append to the question.
如果需要更多详细信息,请让我知道,我将很乐意补充此问题。
Thank you very much for everyones help. 非常感谢大家的帮助。
edit: I'm using the latest version of Firefox on the phone. 编辑:我正在手机上使用最新版本的Firefox。
try to use the e.preventDefault()
on the ontouchmove
of the html element. 尝试在html元素的
ontouchmove
上使用e.preventDefault()
。
<div class="signature" ontouchmove="event.preventDefault();">
</div>
this example works for me: http://jsbin.com/pulul/1/edit?html,css,output 这个例子对我有用 : http : //jsbin.com/pulul/1/edit?html,css,output
Same problem in field on Android browser. Android浏览器中的字段中存在相同问题。 Capturing signature gets dots instead of sig.
捕获签名获取点而不是sig。 So, testing in browser I see the focus is never lost from prior field when i click with mouse into jSignature.
因此,在浏览器中进行测试时,我发现当我用鼠标单击jSignature时,焦点不会从先前的字段丢失。 So, try something like this:
因此,尝试这样的事情:
onblur="if(this.value.length>1) document.getElementById('CustomerSignature').focus()"
Welp, with that you'll see the onblur DOES NOT FIRE when you touch your jSignature but does fire when you touch your other fields. Welp,您将看到onblur在您触摸jSignature时不会触发,而在您触摸其他字段时会触发。 There ya go.
有呀。 Have not been able to reproduce the exact bug reported to me yet on the tablet;
尚未能够在平板电脑上重现报告给我的确切错误; but I think the scroll is being sent to ANOTHER element.
但我认为滚动条正在发送到ANOTHER元素。
So, fix is to force the focus to change to the jSignature. 因此,解决方法是强制将焦点更改为jSignature。 That's what I think.
那就是我所想的。 For now, I fiddled around with the HTML so my last field is a select and use the onchange to set the focus to my jSig.
现在,我摆弄HTML,所以我的最后一个字段是select,并使用onchange将焦点设置到我的jSig。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.