Question

我有一个工具提示，可以在目标文本悬停时激活（显示）。对于触摸设备，此人可以单击目标文本并显示工具提示，然后当他们触摸TOOLTIP（非目标文本）时，工具提示会隐藏。但我希望使用鼠标的人能够在工具提示中选择文本，问题是当他们点击工具提示时，它会隐藏，这是触摸设备的功能。

因此，对于计算机（使用鼠标），我希望能够在不隐藏的情况下点击工具提示，但是在触摸设备上，我希望工具提示在点击时隐藏，以使用户更容易。希望有道理。

最好的方法是什么？有没有办法让我说“触摸时，执行此操作，但点击（使用鼠标）时，请执行此操作”？

http://jsfiddle.net/nicktheandroid/fdWW5/4/

Answer 1

这可能有些过分，但这些是我用来促进跨浏览器触摸事件的一些jQuery扩展：

jQuery.fn.touchstart = function (callback) {
this.each(function () {
var _self = jQuery(this);
var onTouchstart = function (ev) {
  if (ev.originalEvent) {
    if (ev.originalEvent.targetTouches) {
      AddTouchPropertiesToJQEventObject(ev);
      callback.call(this, ev);
    }
  }
};
_self.bind('touchstart', onTouchstart);
});
return this;
};

jQuery.fn.touchmove = function (callback) {
this.each(function () {
var _self = jQuery(this);
var onTouchMove = function (ev) {
  if (ev.originalEvent) {
    if (ev.originalEvent.targetTouches) {
      AddTouchPropertiesToJQEventObject(ev);
      callback.call(this, ev);
    }
  }
};
_self.bind('touchmove', onTouchMove);
});
return this;
};

jQuery.fn.touchend = function (callback) {
this.each(function () {
var _self = jQuery(this);
var onTouchEnd = function (ev) {
  var lastTouchMoveInfo = _self.data('lastTouchMoveInfo');
  ev = $.extend(ev, lastTouchMoveInfo);
  callback.call(this, ev);
};
var onTouchMove = function (ev) {
  var lastTouchMoveInfo = {
    pageX: ev.pageX,
    pageY: ev.pageY,
    touches: ev.touches
  };
  _self.data('lastTouchMoveInfo', lastTouchMoveInfo);
};
_self.touchstart(onTouchMove);
_self.touchmove(onTouchMove);
_self.bind('touchend', onTouchEnd);
});
return this;
};

var AddTouchPropertiesToJQEventObject = function (jqEventObject) {
  jqEventObject.pageX = jqEventObject.originalEvent.targetTouches[0].pageX;
  jqEventObject.pageY = jqEventObject.originalEvent.targetTouches[0].pageY;
  jqEventObject.rotation = jqEventObject.originalEvent.rotation;
  jqEventObject.scale = jqEventObject.originalEvent.scale;
  jqEventObject.targetTouches = jqEventObject.originalEvent.targetTouches;
  jqEventObject.touches = jqEventObject.originalEvent.touches;
};

基本上您想要绑定到touchstart，touchmove和touchend。或者只是touchstart你正在做什么。

用jQuery如何检测/目标触摸但不点击？

1 个答案: