我编写了一个jQuery插件,可以在桌面和移动设备上使用.我想知道是否有一种方法可以检测设备是否具有触摸屏功能.我正在使用jquery-mobile.js来检测触摸屏事件,它可以在iOS,Android等上运行,但我也想根据用户的设备是否有触摸屏来编写条件语句.
那可能吗?
如何向UIView添加触摸事件?
我尝试:
UIView *headerView = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, tableView.bounds.size.width, nextY)] autorelease];
[headerView addTarget:self action:@selector(myEvent:) forControlEvents:UIControlEventTouchDown];
// ERROR MESSAGE: UIView may not respond to '-addTarget:action:forControlEvents:'
Run Code Online (Sandbox Code Playgroud)
我不想创建子类和覆盖
- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
Run Code Online (Sandbox Code Playgroud) 我有一个使用Theme.Dialog样式的活动,这是一个浮动窗口,而不是另一个活动.但是,当我在对话框窗口外部(在背景活动上)单击时,对话框将关闭.我怎么能阻止这种行为?
我正在使用锤子进行拖动,并且在加载其他东西时它会变得不稳定,正如此警告消息告诉我的那样.
由于主线程忙,"touchstart"输入事件的处理延迟了X ms.考虑将事件处理程序标记为"被动"以使页面更具响应性.
所以我试着像这样向听众添加"被动"
Hammer(element[0]).on("touchstart", function(ev) {
// stuff
}, {
passive: true
});
Run Code Online (Sandbox Code Playgroud)
但我仍然收到这个警告.
我想做一个简单的控制:一个内部有视图的容器.如果我触摸容器并移动手指,我想移动视图以跟随我的手指.
我应该使用什么样的容器(布局)?这该怎么做?
我不需要使用表面,而是简单的布局.
我正在开发一个webapp(不是一个有趣文本页面的网站),它有一个非常不同的触摸界面(当你点击时你的手指隐藏屏幕)和鼠标(严重依赖于悬停预览).如何检测到我的用户没有鼠标向他显示正确的界面?我计划为鼠标和触摸的人留下一个开关(就像一些笔记本电脑).
浏览器中的触摸事件功能实际上并不意味着用户正在使用触摸设备(例如,Modernizr不会剪切它).如果设备有鼠标,正确回答问题的代码应该返回false,否则返回true.对于具有鼠标和触摸功能的设备,它应该返回false(不是仅触摸)
作为旁注,我的触摸界面可能也适用于仅限键盘的设备,因此更多的是缺少我想要检测的鼠标.
为了使需求更加清晰,以下是我要实现的API:
// Level 1
// The current answers provide a way to do that.
hasTouch();
// Returns true if a mouse is expected.
// Note: as explained by the OP, this is not !hasTouch()
// I don't think we have this in the answers already, that why I offer a bounty
hasMouse();
// Level 2 (I don't think it's possible, but maybe I'm wrong, so why not asking)
// callback is called when the result of "hasTouch()" …
Run Code Online (Sandbox Code Playgroud) 我创建了一个带有前一个和下一个按钮的旋转木马,它们始终可见.这些按钮具有悬停状态,它们变为蓝色.在触控设备(如iPad)上,悬停状态是粘性的,因此按下按钮后按钮会保持蓝色.我不希望这样.
我可以为每个按钮添加一个no-hover
类ontouchend
,并使我的CSS像这样:button:not(.no-hover):hover { background-color:
blue; }
但这可能对性能非常不利,并且不能正确处理Chromebook Pixel(同时具有触摸屏和鼠标)等设备.
我可以添加一个touch
类documentElement
,并使我的CSS像这样:html:not(.touch) button:hover { background-color: blue;
}
但这也不适用于同时具有触摸和鼠标的设备.
我更喜欢的是删除悬停状态ontouchend
.但这似乎不太可能.聚焦另一个元素不会消除悬停状态.手动点击另一个元素,但我似乎无法在JavaScript中触发它.
我发现的所有解决方案似乎都不完美.有完美的解决方案吗?
在使用浏览器事件时,我已经开始将Safari的touchEvents用于移动设备.我发现addEventListener
s正在堆积条件.这个项目不能使用JQuery.
标准事件监听器:
/* option 1 */
window.addEventListener('mousemove', this.mouseMoveHandler, false);
window.addEventListener('touchmove', this.mouseMoveHandler, false);
/* option 2, only enables the required event */
var isTouchEnabled = window.Touch || false;
window.addEventListener(isTouchEnabled ? 'touchmove' : 'mousemove', this.mouseMoveHandler, false);
Run Code Online (Sandbox Code Playgroud)
JQuery bind
允许多个事件,如下所示:
$(window).bind('mousemove touchmove', function(e) {
//do something;
});
Run Code Online (Sandbox Code Playgroud)
有没有办法像JQuery示例中那样组合两个事件侦听器?例如:
window.addEventListener('mousemove touchmove', this.mouseMoveHandler, false);
Run Code Online (Sandbox Code Playgroud)
任何建议或提示表示赞赏!
我有一个视图叠加在许多其他视图之上.我只是使用过度的方法来检测屏幕上的一些触摸,但除此之外我不希望视图停止下面其他视图的行为,这些是滚动视图等.我怎样才能转发所有的触摸通过这个叠加视图?它是UIView的子项.
使用这样的HTML:
<p>Some Text</p>
Run Code Online (Sandbox Code Playgroud)
然后一些CSS像这样:
p {
color:black;
}
p:hover {
color:red;
}
Run Code Online (Sandbox Code Playgroud)
如何允许长时间触摸启用触摸的设备复制悬停?我可以改变标记/使用JS等,但想不到一个简单的方法来做到这一点.