- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我注意到触摸事件中有一个奇怪的行为。情况是这样的:我有一个#pointercapture
div,默认情况下是隐藏的。 touchstart
处理程序附加到主体,这会导致 pointercapture
显示(覆盖主体)。 pointercapture
附加了 touchend
事件,该事件将其隐藏。问题是,在 touchstartpointercapture
上出现,而在 touchend
上它没有隐藏。您必须再次触摸屏幕并松开才能使其消失。这是 fiddle 。我还附加了鼠标事件,其按预期工作(pointercapture
隐藏在第一个 mouseup
上)。 https://jsfiddle.net/3p8eyug5/
HTML
<body>
<div id="pointercapture"></div>
</body>
CSS
body {
width:500px;
height:500px;
background:green;
}
#pointercapture {
display:none;
position:fixed;
top:0;
left:0;
right:0;
bottom:0;
background:orange;
}
JavaScript
var $=jQuery;
$('body').on('touchstart mousedown', function(e) {
$('#pointercapture').show();
e.preventDefault();
});
$('#pointercapture').on('touchend mouseup', function(e) {
$(this).hide();
e.preventDefault();
});
有人可以解释一下这种行为吗?我也很好奇它如何与指针事件和触摸一起工作,我现在无法检查它。
最佳答案
这是预期的行为。一旦主体捕获到 touchstart 事件,它就会通过 touchend 保存整个触摸 Action (触摸事件出现时不会传输到 #pointercapture)。您只需将 touchend 事件放在 body 上而不是 #pointercapture 上,它就应该按照您所描述的那样工作。
$('body').on('touchstart mousedown', function(e) {
$('#pointercapture').show();
e.preventDefault();
});
$('body').on('touchend mouseup', function(e) {
$('#pointercapture').hide(); // also change this to #pointercapture
e.preventDefault();
});
关于动态显示元素上的 JavaScript touchend 不会触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36361492/
这是我的代码,以防 touchend 事件发生: $('body').on('click touchend', '.typeSelect', function(){ var Classes =
基本上我有这个移动菜单Link (请调整窗口大小以查看移动菜单)。问题在于,在移动设备上,用户通常会向下滑动来查看内容。手机上的主菜单。松开手指而不是第一次触摸时,有什么方法可以激活菜单的“点击”?问
对于在 touchend 事件期间衡量一个元素是否在另一个元素(视觉上)的最佳方法感到困惑。本质上,我正在实现触摸友好的拖放操作。 我看过一些关于 .elementFromPoint() 和 even
这是我第一次处理触摸事件。我正在制作一个按钮,用于在响应式网络上滑动侧面菜单。该按钮应该只显示 touchstart 事件存在,并在 touchend 事件触发后 500 毫秒消失。 这是我的代码:
在 HTML5、CSS3 和 jQuery 的帮助下创建的示例移动应用程序。在应用程序中列出了带有右箭头标记的用户详细信息数量。箭头标记有 touchend 事件。哪个触摸端处理程序导航到下一个屏幕。
我正在运行一个简单的 OpenGL:ES 应用程序(它是一个游戏)。游戏加载并向用户显示“新游戏按钮”,然后您就进入游戏了。我使用 TouchBegan/TouchEnded 来处理触摸。然后我获取坐
是否可以删除touchend 的active 状态?我想通过点击链接来设置链接的事件状态。当然,在我的移动设备中滚动时,我触摸的每个元素都会获得 :active 状态。因此,滚动后所有元素都会突出显示
我想做两件事...当我们触摸屏幕和从屏幕上释放手指时做一些事情。但是下面的 touchend 函数甚至在我释放手指之前就会触发警报框。我错在哪里? $(window).on('touchend', f
我注意到触摸事件中有一个奇怪的行为。情况是这样的:我有一个#pointercapture div,默认情况下是隐藏的。 touchstart 处理程序附加到主体,这会导致 pointercapture
我有一个带有 div 的简单列表(在 iOS 上)。我在列表元素上使用 touchend 事件来执行操作。我这样做是因为 click 事件有大约 500 毫秒的延迟,这让 UI 感觉迟钝。 但是,当我
我有 3 个节点数组,每个数组有 5 个节点。本例中的节点是正方形。 我想使用 touchesBegan 和 touchesEnded 移动它们,保存用户触摸的数组,然后保存手指从屏幕上移开时的位置。
我将 AngularJS 与 Ionic Framework 结合使用。我正在开发实时通信应用程序。 我有一个范围 slider ionic docu .如果我使用 ng-change 每一步都会调用
我有一些代码可以更改表的类。在手机上,有时表格对于屏幕来说太宽了,用户会拖动/滚动来查看内容。但是,当他们触摸并拖动表格时,它会在每次拖动时触发 touchend。 如何测试触摸端是否是触摸拖动的结果
看完这篇event_touchcancel文档: The touchcancel event occurs when the touch event gets interrupted. Differe
我在 ul 的 li 之间使用拖放操作。代码在桌面版本上运行良好。 A A C D E 但是对于移动版本,我得到了多个触摸端 li.addEventListener(
我试图为我为 iPhone 开发的绘图应用程序实现手掌拒绝功能,并注意到触摸事件中有一些奇怪的行为。当我将手掌放在屏幕上并不断抬起手的某个区域然后再次放下时,我会收到很多 touchBegin 事件,
我构建了一个处理 touchstart 的 slider , touchend和 touchmove事件。 它在 Android 和 iOS 上运行良好。 只有当我将 iOS 上的手指慢慢移出屏幕时,
如果元素“#menu”被触摸,我想获取 touchstart 和 touchend 位置。 我写了这段代码,但事件似乎根本没有触发: var lastLoc = 0;
最近我开始在 javascript 中玩触摸事件,我遇到了一个奇怪的 touchend 事件问题(可能是很明显的问题,但我太笨了,无法理解)。所以基本上,这是我的代码: function send(e
我一直在为我的主页开发一个移动网站,但在连接到移动触摸事件时遇到了问题。基本上我想完成以下任务: 用户向下滚动 触发 touchend 事件 --> 调用一个函数来计算滚动后隐藏在上方的文档的数量(如
我是一名优秀的程序员,十分优秀!