为啥我的swipeLeft 事件不起作用呀
$("#large_container").tap(function () {
$(this).hide();
}).swipeLeft(function () {
if (cid & total) {
alert("bb");
loadImg(cid);
非常感谢！
写下你的评论...
Copyright (C)
All Rights Reserved | 京ICP备 号-2这样如何解决jquery。touchSwipe左右滑动和垂直滚动条冲突_软件应用_阁子数码知识网
这样如何解决jquery。touchSwipe左右滑动和垂直滚动条冲突
编辑: 阁子数码知识网 &&&来源:用户发布&&&发布时间:&&&查看次数:37
求教！这样如何解决jquery。touchSwipe左右滑动和垂直滚动条冲突
【探讨解答】
jquerymobile的左右滑动事件swipeleft，当上下划...
Triggered when a horizontal drag of 30px or more (and less than 75px vertically) occurs within 1 second duration in the left direction. See the swipe event entry for more detailed information on the swipe event. 往左1秒内水平移...
jquerymobileswipeleft响应太慢多次滑动才有效果
$(function(){ $("#page1").bind("swipeleft",function(){ $.mobile.cha...您应该把滑动事件绑定到document上而不是page上，因为page切换后就隐藏他的事件也会有一段时间无法触摸到（响应到）。通过绑定document上swipeleft 然后判断当前页面和下一页面来做跳转就不会有这样的卡顿了。另外说一句，jqm效率是很低的。要想...
如何解决jquery.touchSwipe左右滑动和垂直滚动条冲突
解决方式是，我把左右滚动的事件添加到了Body上面，而上下活动的使用了DIV的垂直滚动。 参考代码： $("#body").swipe( { fingers:’all’, swipeLeft:swipe1, swipeRight:swipe2} ); function swipe1(event, direction, distance, duration, finge...
jquery怎么实现移动端手指滑动事件
可以使用jQuery插件TouchSwipe-Jquery-Plugin来完成。 $(function() { //Enable swiping... $("#test").swipe( { //Generic swipe handler for all directions swipe:function(event, direction, distance, duration, fingerCount, fingerData) ...
软件应用相关
更多相关内容
本站内容来自网友发布，本站无法保证其部分内容的正确性，请用户一定仔细辨别。
[] &&[联系QQ：885&971&98] &
沪ICP备号&jQuery Mobile 教程
jQuery Mobile swipe 事件
在元素&p&上水平滑动隐藏它:
$("p").on("swipe",function(){
$(this).hide();});
定义和用法
swipe事件在水平方向上拖动30px以上会触发该事件， (垂直方向小于75px)。
提示: 你可以在左右两个方向上快速滑动。
- 当用户从左划过元素超过 30px 时触发。
- 当用户从右划过元素超过 30px 时触发。
$("selector").on("swipe",function(event){...})
function(event)
必须。指定 swipe 事件触发时执行的函数。 该函数有可选的事件对象
，事件对象可以是任何 jQuery 事件属性 (例如 event.target, event.type, 等)。更多信息请查阅
event.target 属性返回swipe事件触发的DOM元素。
反馈内容（*必填）
截图标记颜色
联系方式(邮箱)
联系邮箱：
投稿页面：
记住登录状态
重复输入密码安卓webview下使用zepto的swipe遇到的坑_Javascript教程_动态网站制作指南
安卓webview下使用zepto的swipe遇到的坑
来源：人气：1704
安卓webview下使用zepto的swe遇到的坑　　众所周知，安卓手机上touch事件一直有各种各样莫名其妙的问题。　　比如，我想要用swipeLeft/swipeRight监听向左向右滑动事件，如果只是单纯为元素增加swipeLeft/swipeRight事件的话在webview下是不生效的。google了下，还是有解决方法的。如果这个页面不需要上下滑动的话，完全可以用$('body').bind("touchmove", function(e) {
e.eventDefault();});解决。即取消body的touchmove默认行为即可。（为什么取消body的touchmove默认行为就能让swipe生效呢？）　　但这种做法太绝对太暴力了，如果页面需要上下滑动的话，那就会出问题。这里有两种情况，第一种是页面内的某个元素需要上下滑动，另一种是页面需要上下滑动。第一种情况，只是页面内某个元素需要上下滑动的话，可为这个元素监听touchmove事件，阻止冒泡。比如：$(id).bind("touchmove", function(e) {
e.stopPropagation()});这样这个元素就可以实现上下滑动了。　　那如果是整个页面需要上下滑动呢？这就比较棘手了。　　我一开始的方案是这样的。不监听swipe事件，全部用touch(touchStart/touchmove/touchEnd)实现，在touchStart事件里获取点击时的坐标位置(startX, startY)，在touchEnd事件里获取手指离开时的坐标位置(endX,endY)。得到手指滑动的距离(distanceX,distanceY);　　distanceX = startX - endX;　　distanceY = startY - endY;　　absoluteX = Math.abs(distanceX);//横向距离绝对值　　absoluteY = Math.abs(distanceY);//纵向距离绝对值　　比较absoluteX和absoluteY的大小，　　absoluteY大则为上下滑动，不采取任何处理，　　absoluteX大则为左右滑动，此时再比较startX - endX为正还是为负，正的话则则向左滑动，负的话为向右滑动。大概代码为这样var startX, startY;var endX, endY;var distanceX, distanceY;$('body').bind('touchstart', function(event) {
startX = event.targetTouches[0].clientX;
startY = event.targetTouches[0].clientY;}).bind('touchend', function(event) {
endX = event.changedTouches[0].clientX;
endY = event.changedTouches[0].clientY;
distanceX = Math.abs(startX - endX);
distanceY = Math.abs(startY - endY);
if (distanceX & distanceY) {
startX - endX & 0 ? swipeLeft() : swipeRight();
　　本以为这样应该没什么问题了，结果&&&　　在安卓webview下我模拟的swipe手势并不会触发touchend事件，我想这应该也是zepto自己封装的swipe事件失效的原因。　　比如，我只点击了一下屏幕，其实就相当于执行了touchStart，紧接着执行了touchEnd。但如果我的手指在页面上进行了滑动操作，他就相当于执行了touchStart，紧接着执行了touchmove，然而手指离开时并不会执行touchEnd事件。那什么情况下它才会执行touchEnd事件呢？　　答案是&&把touchmove事件的默认行为取消的时候。（为什么执行了touchmove就不会执行touchend了呢？）　　所以，还要对body的touchmove事件进行处理。思路是在用户刚开始滑动的时候，判断用户是想上下滑动还是左右滑动，上下滑动的话不做处理，左右滑动的话，对touchmove事件进行preventDefault()操作。如何判断用户刚开始滑动时是想左右还是想上下呢，可通过用户一开始滑动时X轴和Y轴方向的绝对距离进行判断。具体代码如下：var count = 0; //判断用户是否第一次进行touchmove操作var startX, startY;var endX, endY;var distanceX, distanceY;$('body').bind('touchstart', function(event) {
count = 0; //每次开始点击时清零
startX = event.targetTouches[0].clientX;
startY = event.targetTouches[0].clientY;}).bind('touchmove', function(event) {
if (count === 0) { //如果是第一次滑动
endX = event.changedTouches[0].clientX;
endY = event.changedTouches[0].clientY;
distanceX = Math.abs(startX - endX);
distanceY = Math.abs(startY - endY);
if (distanceX & distanceY) { //如果X绝对距离大于Y绝对距离
event.preventDefault();
count++; }).bind('touchend', function(event) {
endX = event.changedTouches[0].clientX;
endY = event.changedTouches[0].clientY;
distanceX = Math.abs(startX - endX);
distanceY = Math.abs(startY - endY);
if (distanceX & distanceY) {
startX - endX & 0 ? swipeLeft() : swipeRight();
}});　　问题完美解决。现在页面既可上下滑动也可左右滑动。补充： 之后google时无意间发现一篇文章(/zldream1106/p/mobile_scroll_end.html)里面有说到swipe的问题IOS当"swipe"时，依次产生如下事件：touchstart -& touchmove * 多次 -& touchend -& scrollAndroid当"swipe"时，swipe虽然不会触发touchend事件，但是会在scroll事件之前触发一次touchcancel事件，即：touchstart -& touchmove -&touchcancel-&scroll*多次Android端的话亲测确实如此，touchmove触发一次，touchcancel触发一次。IOS端的目前暂时还没自测过。所以，刚那个问题在安卓端的话方法二是可行的，只要把touchend改为touchcancel，但为了兼容起见，还是用方法三比较稳妥。但我还没明白为什么在安卓webview下swipe没有触发touchend事件，这个有待研究。
优质网站模板}