向用户显示所有 iphone 屏幕交互事件答案

【问题标题】：Display all iphone screen interaction events to the user向用户显示所有 iphone 屏幕交互事件
【发布时间】：2016-10-25 14:13:39
【问题描述】：

我的 iPhone 屏幕正在播放。我有这个想法，因为我是一名网络开发人员，所以使用我的手机访问我本地机器的网络服务器或 jsfiddle 上的一个页面，并在该页面上运行一些 jquery，这给我一些关于每次触摸的简单反馈事件。（我有一种感觉，例如，即使我没有触摸屏幕，我也会看到许多虚假的滑动事件触发。

所以，是这样的：

<div id="feedback">
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript">

function feedback(msg){
  $("#feedback").append("<div class=\"line\">"+msg+"</div");  
}

$(function() {
  feedback("in $(function) block");
  $(document).on("click", function(event){
    feedback("clicked at "+event.pageX+","+event.pageY);
  });
  //can you replace the below with working code?
  $(document).on("all events", function(event){
    var msg = "Some basic info about this event: if it's a swipe, which direction.  if it's a keypress, which character?  etc"
    feedback(msg);
  });
});  

</script>

我在 jsfiddle 中设置了这个：https://jsfiddle.net/sxqjp9xe/

我是否需要为我感兴趣的每个事件编写一个处理程序，就像我对点击处理程序所做的那样？还是有一些更通用的解决方案？谢谢，马克斯

编辑：将我的“反馈”功能更改为使用prepend() 而不是append()，因为一旦你在那里得到很多行，就会更容易看到。

【问题讨论】：

标签： javascript jquery iphone events mobile

【解决方案1】：

您可以在处理程序中包含多个事件：

function feedback(msg){
$("#feedback").append("<div class=\"line\">"+msg+"</div");  
}

$(document).on("blur touchstart touchmove touchend touchcancel  focus focusin focusout load resize scroll unload click dblclick mousedown mouseup  mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error", function(event) {
var msg = event.type
  feedback(msg);
}

https://jsfiddle.net/e9e0ehyc/

【讨论】：